ICON : (attribute 1 + attribute  2 +..) + VarIcon  ,   (optional)  " literal 1 your   text"  ;
 or
 <ICON : (attribute 1 + attribute  2 +..) + VarIcon  ,  
      <TEXT : (attribute 1 + attribute 2 +..) or " "," literal 1 your  text" >
 or	
ICON : (attribute 1 + attribute 2 +..) + VarIcon, style " color:xxx;background:xxx;font-size:Xxpx or rem"  ; 
>;

	

 
	 		
 icon : $fa_1x + $fa_camera_retro , 
  
	
	

 
	 		
<icon : $fa_1x +      $fa_camera_retro , 
  <text :"", "1x"	>>	;	
<icon : $fa_2x +      $fa_camera_retro , 
  <text :"", "2x"  	>>	;	
<icon : $fa_3x +      $fa_camera_retro , 
  <text :"", "3x"	>>	;	
<icon : $fa_4x +      $fa_camera_retro , 
  <text :"", "4x"	>>	;	
<icon : $fa_5x +      $fa_camera_retro , 
  <text :"", "5x" >>	;

	
	
	

 
	 		
 <icon : $fa_5x + $fa_camera_retro , style:"color:red;background:MistyRose"  	>	;
  
	
	

 
  <button :   attribute   , ICON : VarIcon >;
  or
  <button :   attribute   , ICON : VarIcon , " literal 1 your text" >;
	  	
	
	

 
<button :   $Bts_btn_info    icon   :  $fa_5x +  $fa_address_book_o ,"Address"> ;
<button :  $Bts_btn_Success  ,icon   :  $fa_3x + $fa_pull_right + $fa_flag  ,"Font Awesome
 right">
<button :  $Bts_btn_Success  ,icon   :  $fa_3x + $fa_pull_left +  $fa_flag  ,  "Font Awesome
 left">
	
	

 
<button :   $Bts_default_btn_circle,  icon   :  $fa_check   >	;
<button :   $Bts_primary_btn_circle,  icon   :  $fa_list , text : "2" >	; 
<button :   $Bts_success_btn_circle ,  icon   : $fa_link , text : "3" >	; 
<button :   $Bts_info_btn_circle,  icon   :  $fa_check , text : "4" >	;
<button :   $Bts_warning_btn_circle,  icon   :  $fa_times , text : "5" >	;
<button :   $Bts_danger_btn_circle,  icon   :  $fa_heart , text : "6" >	;  
		
    

 
   	
   <URL :   " url"   , BUTTON : attribute, ICON : VarIcon, TEXT : " literal 1 your url text" >;

	

 
 
<url : "http://facebook.com"      button :  $Bts_btn_social_facebook  ,icon :$fa_facebook  	 >;	
  		
    

 
 <button :  attribute  , 
  <icon   : (attribute 1 + attribute 2 +..) VarIconleft ,   style:"color:XXX;font-size:XXXpx or rem"   , 
      <TEXT :attribute,"your text ">
 	> 
  >;

	

 
	 		
  
 ICON BUTTON UI 
 
  
	 
    

 
<URL :  " literal url "   ,  	
 <BUTTON :  attribute  , 
  <ICON   : (attribute 1 + attribute 2 +..) VarIconleft ,   STYLE:"color:XXX;font-size:XXXpx or rem"   , 
      <TEXT :attribute,"your text ">
 	> 
  >
>;

	

 
<URL :	"http://www.mgplanete.com"
<button :  $Bts_warning_btn_circle_xl  , 
 <icon   :  $fa_pull_left + $fa_flag,   style:"color:blue;font-size:4rem"   , /*font size replace fa_2x */
   <TEXT :$Bts_Text_right_small  + $badge," / b    MgPlanete \ n\ nSoftware   / b   "   >
  > 
 >
>; 
  		
    

Visualise ALL Examples : UI

Prerequisites

#includeSYSpathMS4BI "zInclude\includeChart.h"
- Customisation: all the attributes can be declared in "zInclude\includeChart.h" or another filename.h

Remarks

This example :
driver::\MandragorePlanete\MS4BI\02-DEMO-DESKTOP-BI-EXCELandSTANDARD\90-OTHERS-UI
- We based our main UIs on the widely known and distributed Bootstrap conventions
- We based our main UIs on the widely known and distributed Font Awesome Icons
- The content of a responsive table may include all the MarkerDown abbreviations
Attributes that are currently included in includeChart.h:
$fa_0x
$fa_1x
$fa_2x
$fa_3x
$fa_4x
$fa_5x
, $fa_pull_left
$fa_pull_right
$fa_fw
$fa_address_book
$fa_address_book_o
$fa_address_card
$fa_address_card_o
$fa_adjust
$fa_adn
$fa_align_center
$fa_align_justify
$fa_align_left
$fa_align_right
$fa_amazon
$fa_ambulance
etc... included in includeChart.h and see also ; DRIVER:\MandragorePlanete\MS4BI\02-DEMO-DESKTOP-BI-EXCELandSTANDARD\90-OTHERS-UI\1300-50-UI-IconButtonsList.ms4

UI ICON LIST

  	   
  Visualise MarkerDown Syntax    
	
  Source & Copy MarkerDown Syntax    	


	

See also

BEGIN_DIV : TABLE RESPONSIVE , POSITION :RELATIVE, POSITION :ABSOLUTE, PANEL, ICON, TEXT , LIST_GROUP , TABLE TROW,TCELL, NOTIFICATION, PROGRESSBAR;

Interested in joining us? contact@mgplanete.com
The Mg Planete team

---

Copyright 2022 by Mandragore Planete

the official sites :
mgplanete.com
getms4bi.com
demos.ms4bi.com
help.ms4bi.com
ms4script.com

---

Download

official site :
getms4bi.com

---

Our purpose : Keep it simple !

written with ms4script

• help 01.010.2022.8

MS4BI in 5 minutes