Checklist
Lista tego, co musi się stać, zanim coś będzie gotowe, z linkiem do naprawy każdej pozycji. Pozycje mogą pokazywać stan z danych albo być polami wyboru, które czytelnik zaznacza na liście ręcznej.
- Checklist
- ChecklistItem
PodglądLink do sekcji Podgląd
Na żywo we wszystkich trzech motywach. Wszystko tutaj jest interaktywne.
Dzień, podgląd: Checklist
Ready to go live
What the site needs before visitors see it.
Before the release
- List what changed for readers.
Open issues
Nothing to check yet.
Noc, podgląd: Checklist
Ready to go live
What the site needs before visitors see it.
Before the release
- List what changed for readers.
Open issues
Nothing to check yet.
Wysoki kontrast, podgląd: Checklist
Ready to go live
What the site needs before visitors see it.
Before the release
- List what changed for readers.
Open issues
Nothing to check yet.
UżycieLink do sekcji Użycie
import { Checklist, ChecklistItem } from '@skribly/ui/onboarding'<Checklist title="Ready to go live" doneLabel="done" todoLabel="to do"
progressLabel={(done, total) => `${done} of ${total} done`}>
<ChecklistItem title="Logo" hint="Shown in the header." actionLabel="Fix" href="/settings/logo" />
</Checklist>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ść
- Region nazwany swoim tytułem, z liczbą podaną słowami.
- Wiersze z danych mówią „gotowe” albo „do zrobienia” po tytule i pokazują znacznik albo puste kółko; wiersze do zaznaczania są prawdziwymi polami wyboru z podpowiedzią jako opisem.
- Linki „Fix” mają nazwę razem z pozycją.
- Podpowiedzi i linki znikają, gdy pozycja jest gotowa.
Ten przykład przechodzi przez axe we wszystkich trzech motywach przy każdym uruchomieniu testów. Zobacz, co sprawdzają testy.