Buttons
Button styles
{% import '@leviy-templates/macros/buttons.html.twig' as buttons %}
{{ buttons.button('Primary', 'primary', 'submit') }}
{{ buttons.button('Danger', 'danger', 'submit') }}
{{ buttons.button('Info', 'info', 'submit') }}
{{ buttons.button('Success', 'success', 'submit') }}
{{ buttons.button('Warning', 'warning', 'submit') }}
{{ buttons.button('Dark', 'dark', 'submit') }}
{{ buttons.button('Light', 'light', 'submit') }}
{{ buttons.button('Link', 'link', 'submit') }}
Outline buttons
{% import '@leviy-templates/macros/buttons.html.twig' as buttons %}
{{ buttons.button('Primary', 'outline-primary', 'submit') }}
{{ buttons.button('Danger', 'outline-danger', 'submit') }}
{{ buttons.button('Info', 'outline-info', 'submit') }}
{{ buttons.button('Success', 'outline-success', 'submit') }}
{{ buttons.button('Warning', 'outline-warning', 'submit') }}
{{ buttons.button('Dark', 'outline-dark', 'submit') }}
{{ buttons.button('Light', 'outline-light', 'submit') }}
{{ buttons.button('Link', 'outline-link', 'submit') }}
Flat buttons
{% import '@leviy-templates/macros/buttons.html.twig' as buttons %}
{{ buttons.button('Primary', 'flat-primary', 'submit') }}
{{ buttons.button('Danger', 'flat-danger', 'submit') }}
{{ buttons.button('Info', 'flat-info', 'submit') }}
{{ buttons.button('Success', 'flat-success', 'submit') }}
{{ buttons.button('Warning', 'flat-warning', 'submit') }}
{{ buttons.button('Dark', 'flat-dark', 'submit') }}
{{ buttons.button('Light', 'flat-light', 'submit') }}
{{ buttons.button('Link', 'flat-link', 'submit') }}
Floating action button
{% import '@leviy-templates/macros/buttons.html.twig' as buttons %}
{{ buttons.floating_action_button('add', 'primary') }}
{{ buttons.floating_action_button('add', 'danger') }}
{{ buttons.floating_action_button('add', 'info') }}
{{ buttons.floating_action_button('add', 'success') }}
{{ buttons.floating_action_button('add', 'warning') }}
{{ buttons.floating_action_button('add', 'dark') }}
{{ buttons.floating_action_button('add', 'light') }}
{{ buttons.floating_action_button('add', 'link') }}
Button tags
{% import '@leviy-templates/macros/buttons.html.twig' as buttons %}
{{ buttons.button('Button', 'primary', 'button') }}
{{ buttons.button('Submit', 'primary', 'submit') }}
{{ buttons.button('Reset', 'primary', 'reset') }}
{{ buttons.link('Link', 'primary', 'https://leviy.com') }}
Disabled state
{% import '@leviy-templates/macros/buttons.html.twig' as buttons %}
{{ buttons.button('Primary', 'primary', 'submit', true) }}
{{ buttons.button('Link', 'link', 'submit', true) }}
{{ buttons.link('Link', 'primary', 'https://leviy.com', true) }}
Data attributes (inspect element to see data-* attributes)
{% import '@leviy-templates/macros/buttons.html.twig' as buttons %}
{{ buttons.button('Button', 'primary', 'submit', false, { 'test': 'test' }) }}
{{ buttons.link('Link', 'primary', 'https://leviy.com', false, { 'test': 'test' }) }}
{{ buttons.floating_action_button('add', 'primary', '', 'https://leviy.com', false, { 'test': 'test' }) }}
Target attribute
{% import '@leviy-templates/macros/buttons.html.twig' as buttons %}
{{ buttons.link('Link', 'primary', 'https://leviy.com', false, { 'test': 'test' }, '_blank') }}
Icon buttons
{% import '@leviy-templates/macros/buttons.html.twig' as buttons %}
{{ buttons.icon('people', 'Button title', 'extra-class', 'https://leviy.com', false, { 'test': 'test' }, 'id') }}
{{ buttons.icon('people', 'Button title', 'extra-class', 'https://leviy.com', true, { 'test': 'test' }, 'id') }}