Komponente · 6 Varianten
Nav-Link
components/NavLink.astro
Link im Header: Ruhe, Hover, Active als Haarlinie darunter, Chevron für Menü, Leiste, invers.
Notizen
- Bestand Header: text-paper/70, Hover text-paper, kein Active, kein Chevron.
- Liberate: Active als Strich, kein Fond. Kein Pill-Hover.
Props
| Name | Typ | Default | Notiz |
|---|---|---|---|
| variant | "default" | "hover" | "active" | "chevron" | "leiste" | "invers" | "default" | 01–06. |
| surface | "nacht" | "paper" | "nacht" | Pflicht-Paar. |
<NavLink variant="default" surface="nacht" /> 01 · Default
Vier Links
Header. 70 % Deckung, Hover 100 %.
Nacht
Paper
02 · Hover
Unterstrich
nw-link. Offset 0,35em, 1px.
Nacht
Paper
03 · Active
Haarlinie darunter
Liberate. aria-current=page.
Nacht
Paper
04 · Chevron
Pfeil 12 px
Menü-Panel. aria-expanded schaltet.
Nacht
Paper
05 · Leiste
Tab-Optik in Haarlinie
Feature-Tabs leiste. Active-Kante in fg.
Nacht
Paper
06 · Invers
Auf Gegenfläche
Ebenen. Deckung statt Farbe.
Nacht
Paper