Badge
9.3.2
Badges are small status descriptors for UI elements. A badge usually consists of a small circle that appears in proximity to another object.
| Namn | Typ | Beskrivning |
|---|---|---|
ariaHidden | boolean | If true, the badge's label will be hidden from screen readers while remaining visually visible. |
customAttribute | { attribute: string; value: string |
number } | Used for tests. Clickable and requested subcomponents will be suffixed with "-[ComponentName]". |
isLoading | boolean | If true, a loading skeleton will be rendered instead of the component. |
negativeMargins | boolean | Negative margins. |
npm install @sj-ab/component-library.ui.badgeSemantik
En Badge presenteras som vanlig text (<span>).
Färg som komplement
Se till att informationen som presenteras i en Badge går att förstå även för användare som inte kan se eller urskilja den färgade cirkeln.
Don't
Använd inte färgen i sig för att förmedla viktig information, till exempel förseningar
Do
Använd den färgade cirkeln som komplement och förstärkning för den synliga texten