These macros allow to display buttons in different sizes, colors with behaviors according to the size of the screen
Here are the available colors.
<@button color='default' title='default' />
<@button color='primary' title='primary' />
<@button color='secondary' title='secondary' />
<@button color='link' title='link' />
<@button color='info' title='info' />
<@button color='success' title='success' />
<@button color='warning' title='warning' />
<@button color='danger' title='danger' />
Here are the available sizes.
<@button size='xs' title='Extra Small' />
<@button size='sm' title='Small' />
<@button title='Default' />
<@button size='md' title='Medium' />
<@button size='lg' title='Large' />
Here are some examples of icons.
<@button buttonIcon='github' title='Extra Small' />
<@button buttonIcon='twitter' title='Twitter' />
<@button buttonIcon='times' title='Cancel' />
<@button buttonIcon='check' title='Validate' />
<@button buttonIcon='trash' title='Delete' />
<@button buttonIcon='external-link-alt' title='External link' iconPosition='right' />
Display only the icon with a tooltip when the mouse is over the button. Used for toolbar or actions list.
<@button buttonIcon='github' title='Extra Small' hideTitle=['all'] />
<@button buttonIcon='twitter' title='Twitter' hideTitle=['all'] />
<@button buttonIcon='times' title='Cancel' hideTitle=['all'] />
<@button buttonIcon='check' title='Validate' hideTitle=['all'] />
<@button buttonIcon='trash' title='Delete' hideTitle=['all'] />
Display or hide labels according the size of the screen
<@button buttonIcon='github' title='Extra Small' hideTitle=['xs','sm'] />
<@button buttonIcon='twitter' title='Twitter' hideTitle=['xs','sm'] />
<@button buttonIcon='times' title='Cancel' hideTitle=['xs','sm'] />
<@button buttonIcon='check' title='Validate' hideTitle=['xs','sm'] />
<@button buttonIcon='trash' title='Delete' hideTitle=['xs','sm'] />
| Parameter | Value | Default |
|---|---|---|
| name | ||
| id | ||
| type | button/submit | button |
| size | xs/sm/md/lg | none |
| color | primary/info/warning/danger/success | primary |
| style | string | none |
| title | string | none |
| hideTitle | sequence | none |
| buttonIcon | string | none |
| disabled | boolean | false |
| iconPosition | string | left |
| dropdownMenu | boolean | false |
| cancel | boolean | false |
| form | string | none |
This macro displays anchor links as buttons.
Here are the available colors.
<@aButton href='#' title='default' />
<@aButton href='#' color='primary' title='primary' />
<@aButton href='#' color='secondary' title='secondary' />
<@aButton href='#' color='link' title='link' />
<@aButton href='#' color='info' title='info' />
<@aButton href='#' color='success' title='success' />
<@aButton href='#' color='warning' title='warning' />
<@aButton href='#' color='danger' title='danger' />
Here are the available sizes.
<@aButton href='#' size='xs' title='Extra Small' />
<@aButton href='#' size='sm' title='Small' />
<@aButton href='#' title='Default' />
<@aButton href='#' size='md' title='Medium' />
<@aButton href='#' size='lg' title='Large' />
Here are some examples of icons.
<@aButton href='#' buttonIcon='github' title='Extra Small' />
<@aButton href='#' buttonIcon='twitter' title='Twitter' />
<@aButton href='#' buttonIcon='times' title='Cancel' />
<@aButton href='#' buttonIcon='check' title='Validate' />
<@aButton href='#' buttonIcon='trash' title='Delete' />
<@aButton href='#' buttonIcon='external-link-alt' title='External link' iconPosition='right' />
Display only the icon with a tooltip when the mouse is over the button. Used for toolbar or actions list.
<@aButton href='#' buttonIcon='github' title='Extra Small' hideTitle=['all'] />
<@aButton href='#' buttonIcon='twitter' title='Twitter' hideTitle=['all'] />
<@aButton href='#' buttonIcon='times' title='Cancel' hideTitle=['all'] />
<@aButton href='#' buttonIcon='check' title='Validate' hideTitle=['all'] />
<@aButton href='#' buttonIcon='trash' title='Delete' hideTitle=['all'] />
Display or hide labels according the size of the screen
<@aButton href='#' buttonIcon='github' title='Extra Small' hideTitle=['xs','sm'] />
<@aButton href='#' buttonIcon='twitter' title='Twitter' hideTitle=['xs','sm'] />
<@aButton href='#' buttonIcon='times' title='Cancel' hideTitle=['xs','sm'] />
<@aButton href='#' buttonIcon='check' title='Validate' hideTitle=['xs','sm'] />
<@aButton href='#' buttonIcon='trash' title='Delete' hideTitle=['xs','sm'] />
| Parameter | Value | Default |
|---|---|---|
| name | ||
| id | ||
| href | string | none |
| size | xs/sm/md/lg | none |
| color | primary/info/warning/danger/success | primary |
| class | string | none |
| params | string | none |
| title | string | none |
| hideTitle | sequence | none |
| buttonIcon | string | none |
| disabled | boolean | false |
| iconPosition | string | left |
| dropdownMenu | boolean | false |