Button

Buttons

Buttons represent a clear action for a user to perform.

How to use

Buttons use the button element and the variant is controlled by class name e.g. button-primary.

Variants

Primary

<Button variant="primary">Primary</Button>

Primary buttons are used sparingly on the site, reserved for links to higher-profile content like in a hero component.

Secondary

<Button variant="secondary">Secondary</Button>

The secondary and disabled button styles are not in use at all, but may be handy if forms are created in the future.

Tertiary

<Button variant="tertiary">Tertiary</Button>

Disabled

<Button variant="disabled">Disabled</Button>

The secondary and disabled button styles are not in use at all, but may be handy if forms are created in the future.

Props/Methods

The <Button> is a foundational trigger component for capturing and guiding user-interaction.

NameDescriptionTypeRequiredDefault
variant

The modifier name for the Button

enumno
'primary'