AuthLayout
Rama ekranów logowania i resetowania hasła: marka na górze, jedna karta z nagłówkiem strony i miejsce na przełącznik języka pod spodem. Użyj jej do każdego krótkiego zadania, które czytelnik wykonuje przed wejściem do aplikacji.
- AuthLayout
PodglądLink do sekcji Podgląd
Na żywo we wszystkich trzech motywach. Wszystko tutaj jest interaktywne.
Dzień, podgląd: AuthLayout
Noc, podgląd: AuthLayout
Wysoki kontrast, podgląd: AuthLayout
UżycieLink do sekcji Użycie
import { AuthLayout } from '@skribly/ui/pages'<AuthLayout id="content" title="Sign in" brand={<Logo kind="tracker" />} titleId="auth-title">
<LoginForm labels={labels} aria-labelledby="auth-title" onSubmit={signIn} />
</AuthLayout>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ść
- Renderuje landmark main nazwany swoim nagłówkiem, więc działa jako cel linku pomijającego.
- Karta rośnie razem z zawartością, a strona się przewija zamiast ucinać treść, zarówno przy powiększeniu 200%, jak i przy szerokości 320 px.
Ten przykład przechodzi przez axe we wszystkich trzech motywach przy każdym uruchomieniu testów. Zobacz, co sprawdzają testy.