Powierzchnie
Pudełka, z których składa się ekran: karty, kafelki ze statystykami, baner powitalny, sekcje ustawień, lista rzeczy wymagających uwagi, separatory i kafelki do wyboru. Każdy układa się od 320 px i zachowuje krawędzie w trybie wysokiego kontrastu systemu Windows.
Strony: 7, eksporty: 13
- Card
- CardHeader
- CardTitle
- CardBody
- CardFooter
- StatCard
- Hero
- SettingsSection
- AttentionItem
- AttentionList
- Divider
- OptionCard
- OptionCardGroup
ImportLink do sekcji Import
Każda grupa ma własny punkt wejścia, więc aplikacja, która potrzebuje tylko tej grupy, ładuje tylko ją. Wszystko jest też eksportowane z @skribly/ui.
import { Card, CardHeader, CardTitle, CardBody, … } from '@skribly/ui/surfaces'Strony tej grupyLink do sekcji Strony tej grupy
- CardObramowana powierzchnia dla jednego bloku treści. Użyj części nagłówka, treści i stopki dla panelu z tytułem i akcjami; użyj samej karty z wypełnieniem dla prostego pudełka.Card, CardHeader, CardTitle, CardBody, CardFooter
- StatCardJedna liczba z etykietą, do rzędu wartości na górze pulpitu. Dodaj href albo onPress, gdy liczba prowadzi do pełnej listy.StatCard
- HeroBaner powitalny na górze ekranu głównego, z powitaniem, jednym akapitem i pierwszymi akcjami. Użyj go raz na stronę.Hero
- SettingsSectionBlok ekranu ustawień z tytułem. Wiersze w środku są rozdzielone linią; wyłącz framed, aby pod nagłówkiem umieścić własne karty.SettingsSection
- AttentionItemKrótka lista tego, czego czytelnik potrzebuje dzisiaj: liczba, czego dotyczy, dlaczego i droga do celu. Pozycje blokujące oznacz jako urgent. Gdy lista jest pusta, przekaż pusty stan z następnym krokiem.AttentionItem, AttentionList
- DividerLinia między grupami treści, pozioma lub pionowa, z opcjonalnym słowem w środku, na przykład Or.Divider
- OptionCardKafelki do wyboru z podglądem, dla wyborów ocenianych na oko: motywy, fonty, animacje. Jeden wybór tworzy grupę przycisków opcji, a selectionMode="multiple" grupę pól wyboru.OptionCard, OptionCardGroup