Jøkul ThumbDownIcon

Jøkul · Ikoner

Pakke: @fremtind/jokul

ThumbDownIcon er et Jøkul-ikon som brukeren skal forstå at kontrollen gir negativ tilbakemelding eller avvisning.

Eksporten `ThumbDownIcon` 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

ThumbDownIcon · nøytral linjevariant som standard

Skalerer med typografien

Brødtekst
Mellomtittel
Større fremheving

I kontekst

Marker som ikke nyttig

Kode

React · tsx

import "@fremtind/jokul/styles/core/core.css";
import "@fremtind/jokul/styles/components/icon/icon.min.css";
import "@fremtind/jokul/styles/fonts/webfonts.min.css";
import { ThumbDownIcon } from "@fremtind/jokul/icon";

export function Example() {
    return (
        <span>
            <ThumbDownIcon aria-hidden="true" />
            <span>Marker som ikke nyttig</span>
        </span>
    );
}

HTML · html

<span>
    <span class="jkl-icon" aria-hidden="true"></span>
    <span>Marker som ikke nyttig</span>
</span>

Når du skal bruke ThumbDownIcon

ThumbDownIcon fungerer best når brukeren skal forstå at kontrollen gir negativ tilbakemelding eller avvisning.

Handlingsikoner bør brukes varsomt og bare når formen er allment forstått i konteksten eller støttes av synlig tekst.

Bruk ikon og tekst sammen når handlingen ikke er helt selvforklarende.
Hold samme ikon for samme type handling på tvers av liknende flater og mønstre.

Tilgjengelighet

Ikonbaserte handlinger må alltid ha et tilgjengelig navn via synlig tekst eller `aria-label` på kontrollen rundt.

Dekorative handlingsikoner bør skjules fra skjermlesere når teksten ved siden av allerede beskriver handlingen.

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	ThumbDownIcon	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	action	brukeren skal forstå at kontrollen gir negativ tilbakemelding eller avvisning

Relatert

Installer Jøkul : Hent inn core og ikonstilene før du bruker Jøkul-ikonene lokalt.