EmptyState
To, co wypełnia widok, który nie ma nic do pokazania: jeszcze nic, brak wyników albo nie udało się załadować. Zawsze podaj następny krok, taki jak utworzenie pierwszej pozycji, wyczyszczenie filtrów albo ponowna próba.
- EmptyState
PodglądLink do sekcji Podgląd
Na żywo we wszystkich trzech motywach. Wszystko tutaj jest interaktywne.
Dzień, podgląd: EmptyState
No projects yet
Projects keep your files, tasks and notes together.
Could not load the projects
The server did not answer. Your work is safe.
No results for “quarterly report draft”
Check the spelling or clear the filters.
Inbox zero
Nothing needs you right now.
Noc, podgląd: EmptyState
No projects yet
Projects keep your files, tasks and notes together.
Could not load the projects
The server did not answer. Your work is safe.
No results for “quarterly report draft”
Check the spelling or clear the filters.
Inbox zero
Nothing needs you right now.
Wysoki kontrast, podgląd: EmptyState
No projects yet
Projects keep your files, tasks and notes together.
Could not load the projects
The server did not answer. Your work is safe.
No results for “quarterly report draft”
Check the spelling or clear the filters.
Inbox zero
Nothing needs you right now.
UżycieLink do sekcji Użycie
import { EmptyState } from '@skribly/ui/feedback'<EmptyState
icon={<Inbox />}
title="No projects yet"
description="Projects keep your files and tasks together."
actions={<Button>New project</Button>}
/>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ść
- Tytuł jest prawdziwym nagłówkiem; ustaw headingLevel, aby pasował do struktury strony.
- Ikona jest ukryta.
- Ton niebezpieczeństwa jest dla niepowodzeń, a jego tytuł mówi, co się nie udało, więc kolor nigdy nie jest jedynym sygnałem.
- Tekst się zawija i centruje przy każdej szerokości.
Ten przykład przechodzi przez axe we wszystkich trzech motywach przy każdym uruchomieniu testów. Zobacz, co sprawdzają testy.