Komponente · 6 Varianten
Lade-Zustand
components/LadeZustand.astro
Skeleton-Sätze für Karte, Karten-Raster, Liste, Text, Tabelle, ganze Seite. Fond in Fond, animate-pulse, aria-busy.
Notizen
- Bestand: Fortschritt (Element) hat Skeleton-Text und -Karte; hier die Kompositionen.
- reduced-motion stoppt das Pulsieren global.
Props
| Name | Typ | Default | Notiz |
|---|---|---|---|
| variant | "karte" | "karten" | "liste" | "text" | "tabelle" | "seite" | "karte" | 01–06. |
| surface | "nacht" | "paper" | "nacht" | Pflicht-Paar. |
<LadeZustand variant="karte" surface="nacht" /> 01 · Karte
Icon, Titel, zwei Zeilen
Fortschritt skeleton-karte. max-w-xs.
Nacht
Paper
02 · Karten
Drei nebeneinander
Feature-Grid. —
Nacht
Paper
03 · Liste
Avatar, Zeile, Zahl
Blog-Card liste. Haarlinien.
Nacht
Paper
04 · Text
H2 und drei Zeilen
Prose. —
Nacht
Paper
05 · Tabelle
Vier Spalten, vier Zeilen
Tabelle. —
Nacht
Paper
06 · Seite
Titel, Band, drei Karten
Startseite. gap-12.
Nacht
Paper