Element · 6 Varianten
Wahl
elements/Wahl.astro
Checkbox quadratisch, Radio rund, Toggle als Pille. Gewählt = Oliv-Fill, das einzige Oliv als Fläche im System, 20 px groß.
Notizen
- Bestand: kein Auswahl-Element.
- Oliv nie als Ruhefläche. Hier als 20-px-Marke für gewählt, vergleichbar Signal-Punkt. Zu prüfen bei Review.
- Toggle: role=switch, Knopf granit-500 aus, oliv-500 an, 150 ms.
Props
| Name | Typ | Default | Notiz |
|---|---|---|---|
| variant | "checkbox" | "radio" | "toggle" | "gruppe" | "error" | "disabled" | "checkbox" | 01–06. |
| surface | "nacht" | "paper" | "nacht" | Pflicht-Paar. |
<Wahl variant="checkbox" surface="nacht" />01 · Checkbox
Quadrat 20
Anfrage. Kein Haken-Glyph, Fill genügt.
Nacht
Paper
02 · Radio
Rund 20
Anfrage. rounded-full, eine Wahl.
Nacht
Paper
03 · Toggle
Pille 40 × 24
Slot-Pille. Knopf wandert 16 px.
Nacht
Paper
04 · Gruppe
fieldset, legend als Label
Formulare. gap-3.
Nacht
Paper
05 · Error
Kante granit-800, Punkt
Feld Error. aria-invalid.
Nacht
Bitte bestätigen.
Paper
Bitte bestätigen.
06 · Disabled
opacity-50
Feld disabled. Zustand bleibt lesbar.
Nacht
Paper