Gallery / Demo Components / Button Gallery / / Button
Demo Components /
Documentation

Description

A configurable button with size and variant modifiers.

Demonstrates: - StrParam with positional args - StrParam(css_class=True) — value injected as a CSS modifier class - BoolParam(css_class=True) — adds a CSS class when truthy - Co-located CSS file (button.css) discovered automatically - Co-located HTML template (button.html) discovered automatically

Example usage::

{% button "Save changes" %}
{% button "Delete" variant="danger" disabled=True %}

Usage

Minimal example

{% button "Click Me" variant="primary" %}

Bigger example

{% button
  "foo"
  variant="primary"
  disabled=True
%}

Qualified tag usage

{% btn__button "Click Me" variant="primary" %}

Parameters

Name Type Required Default Choices Description
label str Yes — — The button label.
variant str No primary primary , secondary , danger Variant modifier
disabled bool No — — Renders the button as disabled.
Sandbox
{% button "Click Me" variant="primary" %}

<button class="btn primary disabled" disabled>
  foo
</button>