Buttons
Variants
Primary
Secondary
Tertiary
Ghost
Premium
Error
Claim
Play
Currency
Sizes
Close
Status
Loading
Display a loading effect by adding the.is-loading class name to your button.
Disabled
Disable a button by adding either a.is-disabled class name or a [disabled]attribute to your button.
Shining
Simply add the .is-shining class name to add a shiny animation to your button
Feedback
In label
Display a textual feedback to your button by adding a[data-feedback="feedback message"] attribute to your button. The feeedback message is visible for 4 seconds.
In tooltip
You can choose to put the feedback in a tooltip message by adding a[data-feedback-icon="success || error || attention"] attribute to your button. Like the label feeedback, the message is visible for 4 seconds.
Responsive sizes
You can change the size of the button based on the screen size using the following class name: .{xx}:button-{xx}.
{xx} can be xs, sm, md, lg, xl.