Komponente · 6 Varianten
Suchfeld
components/Suchfeld.astro
Suche mit Lupe links, Clear rechts, ⌘K-Hinweis, Ergebnis-Liste opak darunter, Leer-Meldung, große Variante.
Notizen
- Bestand: nichts. Feldoptik aus Feld, Kbd aus Hinweis.
- Ergebnisliste als Deckel z 40, Haarlinie, aktive Zeile im Fond.
Props
| Name | Typ | Default | Notiz |
|---|---|---|---|
| variant | "icon" | "clear" | "kbd" | "ergebnisse" | "leer" | "gross" | "icon" | 01–06. |
| surface | "nacht" | "paper" | "nacht" | Pflicht-Paar. |
<Suchfeld variant="icon" surface="nacht" />01 · Icon
Lupe 16 links
Feld. type=search.
Nacht
Paper
02 · Clear
× rechts bei Wert
Tag removable. type=reset.
Nacht
Paper
03 · Kbd
⌘ K rechts
Hinweis kbd. Hinweis, kein Shortcut.
Nacht
Paper
04 · Ergebnisse
Liste unter dem Feld
Menü-Panel. role=listbox.
Nacht
- Index vor AdsArtikel
- IndexLeistung
- Integrationen-GridSektion
Paper
- Index vor AdsArtikel
- IndexLeistung
- Integrationen-GridSektion
05 · Leer
Nichts gefunden
Leerzustand. Caption.
Nacht
Nichts gefunden für „Index“. Anders schreiben?
Paper
Nichts gefunden für „Index“. Anders schreiben?
06 · Groß
text-lg, py-4
Hero. Für Suchseite.
Nacht
Paper