ToneDot
Stan czegokolwiek, co działa, jako mały znak i słowo. Wybierz go w wierszach i nagłówkach; używaj etykiety, nawet tam, gdzie jest ukryta.
- ToneDot
PodglądLink do sekcji Podgląd
Na żywo we wszystkich trzech motywach. Wszystko tutaj jest interaktywne.
Dzień, podgląd: ToneDot
- Running
- Starting
- Restarting
- Paused
- Stopped
- Crashed
- Unhealthy
Noc, podgląd: ToneDot
- Running
- Starting
- Restarting
- Paused
- Stopped
- Crashed
- Unhealthy
Wysoki kontrast, podgląd: ToneDot
- Running
- Starting
- Restarting
- Paused
- Stopped
- Crashed
- Unhealthy
UżycieLink do sekcji Użycie
import { ToneDot } from '@skribly/ui/ops'<ToneDot state="running" label={t('state.running')} />
<ToneDot state="exited" label={t('state.crashed')} hideLabel />Każda etykieta jest propem, więc aplikacja przekazuje własne słowa we własnym języku. Zobacz zasadę brak wbudowanego tekstu.
DostępnośćLink do sekcji Dostępność
- Każdy stan ma własny kształt: pełne koło, pierścień, kreski, otwarty pierścień, romb i trójkąt.
- Słowo jest zawsze na stronie, widoczne albo dla czytników ekranu.
- Stany w ruchu pulsują i zatrzymują się przy ograniczonym ruchu.
- Znak przyjmuje kolor tekstu w trybie wymuszonych kolorów.
Ten przykład przechodzi przez axe we wszystkich trzech motywach przy każdym uruchomieniu testów. Zobacz, co sprawdzają testy.