State helpers
Utilities for communicating state in the DOM.
Quick reference
Section titled “Quick reference”| Class | Styles |
|---|---|
af-is-disabled | opacity: 0.6; cursor: not-allowed; pointer-events: none |
af-is-loading | opacity: 0.7; pointer-events: none |
af-is-active | opacity: 0.9 |
af-is-muted | opacity: 0.6 |
af-has-error | border-color: var(--af-color-danger) |
af-has-focus | border-color: var(--af-color-primary) |
Examples
Section titled “Examples”Disabled
<button class="af-btn af-is-disabled">
Disabled
</button>Available classes
Section titled “Available classes”af-is-disabledaf-is-loadingaf-is-activeaf-is-mutedaf-has-erroraf-has-focus