Jøkul · Ikoner
Pakke: @fremtind/jokul
Installasjon: Se relevant guide
ChevronLeftIcon er et Jøkul-ikon som brukeren skal forstå at noe flyttes eller navigeres mot venstre.
Eksporten `ChevronLeftIcon` bygger på Jøkul sin felles Icon-wrapper og bruker materialsymbol-fonten som følger med ikonstilene.
Denne eksporten rendres som nøytral linjevariant som standard, så docs-siden viser den slik komponenter normalt vil møte den i praksis.
Eksempel
ChevronLeftIcon · nøytral linjevariant som standard
Skalerer med typografien
Brødtekst
Mellomtittel
Større fremheving
Kode
React · tsximport "@fremtind/jokul/styles/core/core.css";
import "@fremtind/jokul/styles/components/icon/icon.min.css";
import "@fremtind/jokul/styles/fonts/webfonts.min.css";
import { ChevronLeftIcon } from "@fremtind/jokul/icon";
export function Example() {
return (
<span>
<ChevronLeftIcon aria-hidden="true" />
<span>Forrige side</span>
</span>
);
}
HTML · html<span>
<span class="jkl-icon" aria-hidden="true"></span>
<span>Forrige side</span>
</span>
Når du skal bruke ChevronLeftIcon
ChevronLeftIcon passer når brukeren skal forstå at noe flyttes eller navigeres mot venstre.
Navigasjonsikoner bør støtte retning og forventning, men teksten rundt må fortsatt beskrive målet eller handlingen klart.
- Bruk samme ikon konsekvent for samme type bevegelse, åpning eller retning.
- Ikonet bør understøtte en etikett, ikke erstatte den i vanlige lenker og knapper.
Tilgjengelighet
Retningsikoner kan være nyttige for seende brukere, men kontrollen må fortsatt ha et tydelig navn.
Ikonet bør skjules fra skjermlesere når teksten allerede beskriver navigasjonen godt nok.
- Skjul dekorative ikoner med `aria-hidden="true"` når teksten rundt allerede forklarer meningen.
- Hvis ikonet brukes alene i en knapp eller lenke, må kontrollen få et tydelig tilgjengelig navn.
Ikonkontrakt
| Felt | Verdi | Notat |
| Eksport | ChevronLeftIcon | Navnet du importerer fra `@fremtind/jokul/icon`. |
| Import | @fremtind/jokul/icon | Jøkul samler ikonene i samme ikoninngang som den felles wrapperen. |
| Standardstil | nøytral linjevariant som standard | Det er denne varianten komponentene normalt bruker som utgangspunkt. |
| Typisk bruk | navigation | brukeren skal forstå at noe flyttes eller navigeres mot venstre |
Relatert
- Installer Jøkul : Hent inn core og ikonstilene før du bruker Jøkul-ikonene lokalt.