Design System
Playground Zur Vorlage

Sektionen · ContentGalerie

Sektion · 6 Varianten

Galerie

sections/Galerie.astro

Bilder im Raster: drei Spalten, Mauer mit columns, Bento mit großem erstem Bild, Haarlinien-Fugen, Captions, randlos.

Notizen

  • Bestand: Case-Grid ist Karten, keine Galerie.
  • Kein Hover-Zoom, kein Overlay. Lightbox als Ziel später.

Props

Name Typ Default Notiz
variant "raster" | "mauer" | "bento" | "haarlinie" | "caption" | "voll" "raster" 01–06.
surface "nacht" | "paper" "nacht" Pflicht-Paar.
<Galerie variant="raster" surface="nacht" />

01 · Raster

3 Spalten, 4:3

Feature-Grid. gap-6.

Nacht

Paper

02 · Mauer

columns, wechselnde Ratios

Masonry. Kein JS.

Nacht

Paper

03 · Bento

Erstes Bild 2×2

Feature-Bento. —

Nacht

Paper

04 · Haarlinie

Fugen 1px

Logo-Wall raster. gap-px auf Linienfarbe.

Nacht

Paper

05 · Caption

Unter jedem Bild

Bild caption. —

Nacht

  • Werkstatt 1
  • Werkstatt 2
  • Werkstatt 3
  • Werkstatt 4
  • Werkstatt 5
  • Werkstatt 6

Paper

  • Werkstatt 1
  • Werkstatt 2
  • Werkstatt 3
  • Werkstatt 4
  • Werkstatt 5
  • Werkstatt 6

06 · Voll

Randlos, gap-0

Cover. px-0.

Nacht

Paper