Element · 6 Varianten
Haarlinie
elements/Haarlinie.astro
Divider als Element: horizontal, vertikal, mit Label, mit Index, kurzer Strich, Abstand. 1px, granit-200 / granit-800.
Notizen
- Bestand: border-t/border-b ad hoc in Sektionen, Section-Label setzt einen Strich. Kein Element.
- Liberate: Haarlinie trägt Zeilen und Raster, nie dicker als 1px.
- Wenn Approved: Element Haarlinie mit Props orientation, label, index.
Props
| Name | Typ | Default | Notiz |
|---|---|---|---|
| variant | "horizontal" | "vertikal" | "label" | "index" | "kurz" | "abstand" | "horizontal" | 01–06. |
| surface | "nacht" | "paper" | "nacht" | Pflicht-Paar. |
<Haarlinie variant="horizontal" surface="nacht" />01 · Horizontal
hr
Zeilen. border-t, Farbe nach Fläche.
Nacht
Paper
02 · Vertikal
w-px in Flex
Header. Höhe vom Parent.
Nacht
Links Rechts
Paper
Links Rechts
03 · Label
Wort in der Mitte
Formulare. nw-label, flex-1 beidseitig.
Nacht
Oder
Paper
Oder
04 · Index
01 vorn, Linie läuft aus
Section-Label. Zeilenkopf.
Nacht
01
Paper
01
05 · Kurz
48 px Strich
Section-Label strich. Ornament, kein Trenner.
Nacht
Paper
06 · Abstand
my-12
Prose. Luft nach Leiter.
Nacht
Vor der Linie.
Nach der Linie. Abstand 48, Leiter.
Paper
Vor der Linie.
Nach der Linie. Abstand 48, Leiter.