Buttons

Buttons trigger an action. Use a link when the user is navigating to another page or location. The design system styles Bootstrap’s public .btn API; there is intentionally no .est-btn alias.

Primary and secondary

<button class="btn btn-primary" type="button">Primary</button>
<button class="btn btn-outline-primary" type="button">Secondary</button>
<button class="btn btn-primary" type="button" disabled>Unavailable</button>

Use one primary button for the main action in a region. Prefer an outline button for a secondary action; Bootstrap’s filled .btn-secondary is not part of the supported MVP contract.

Sizes and disabled state

<button class="btn btn-primary" type="button">Default button</button>
<button class="btn btn-primary btn-sm" type="button">Small button</button>

Native disabled is appropriate for buttons. Do not disable an action merely to hide validation requirements: explain what is needed and allow the user to attempt submission.

Accessibility

• Use concise text that describes the action.
• Keep the visible focus treatment intact.
• Do not use colour alone to distinguish actions.
• Icon-only buttons require an accessible name and are deferred from the MVP.