<button type="button" class="btn btn-sm btn-primary -iconRight">
Button
</button>
<button type="button"{% if disabled %} disabled{% endif %} class="btn{% if color %} btn-{{color}}{% endif %}{% if small %} btn-sm{% endif %}{% if block %} btn-block{% endif %}{% if border and not valid and not invalid %} btn-outline-dark{% elif invalid %} btn-outline-danger{% elif valid %} btn-outline-success{% else %}{% if color == "" %} btn-primary{% endif %}{% endif %}{% if icon %} -icon{% endif %}{% if placement == "left" %} -iconLeft{% else %} -iconRight{% endif %}{% if thin %} -thin{% endif %}{% if extraClass %}{{extraClass}}{% endif %}{% if full_width %} w-100{% endif %}" {% if invalid or valid or tooltip %}data-toggle="popover" data-html="true" data-trigger="hover" data-content="<div class='{% if valid %}valid-feedback{% endif %}{% if invalid %}invalid-feedback{% endif %}{% if tooltip_message %} d-inline-block{% endif %}'>{% if show_feedback %}{{tooltip_message}}{% endif %}</div>" data-placement="bottom"{% endif %}>
{% if placement == "left" %}
{% if icon %}<i class="icon-{{icon}}"></i>{% endif %}
{{text}}
{% else %}
{{text}}
{% if icon %}<i class="icon-{{icon}}"></i>{% endif %}
{% endif %}
</button>
{
"text": "Button",
"icon": "",
"placement": "",
"border": false,
"block": false,
"small": true,
"full_width": false,
"thin": false,
"invalid": false,
"valid": false,
"tooltip_message": "Error message",
"show_feedback": false,
"disabled": false,
"color": "",
"extraClass": "",
"tooltip": false,
"tooltip_html": "",
"tooltip_trigger": "",
"trigger": "hover",
"popover_content": false
}
Default button zal nog aangepast worden (in afwachting van user tests resultaten)