Logo
4.1.1
A description of this component is work in progress.
| Namn | Typ | Beskrivning |
|---|---|---|
ariaHidden | boolean | If true, the logo will be hidden from screen readers. |
ariaLabel | string | Aria label attribute for enhanced accessibility. |
className | string | Optional CSS class name. |
customAttribute | { attribute: string; value: string |
number } | Used for tests. Clickable and requested subcomponents will be suffixed with "-[ComponentName]". |
height | number | Height of the logo. |
isLoading | boolean | If true, a loading skeleton will be rendered instead of the component. |
lang | "sv" |
"en" | Language used for internal translations. |
style | Record | Style attribute for inline styling |
width | number | Width of the logo. |
npm install @sj-ab/component-library.ui.logoSemantik
Logo presenteras vanligtvis som en meningsbärande SVG-ikon med en alternativ text:
<svg role="img" aria-label="SJ, logotyp">Tillgängligt namn
Komponenten har en inbyggd översättning med namn för alla olika varumärken och varianter på både svenska och engelska. Det finns en möjlighet för utvecklare att skriva över default-namnet med aria-label men detta ska vanligtvis inte behövas.
Om logotypen ska användas i en situation där den är dekorativ och man inte vill att den ska läsas upp av skärmläsare så kan man använda propen ariaHidden
Mörkt läge och högkontrast
Komponenten har inbyggt stöd för att hantera mörkt läge och högkontrastläge så att logotypen alltid är läsbar.
Importer av Logo
Repos med Logo
Senaste installerade version av Logo
Äldsta installerade version av Logo