Design System
Playground Zur Vorlage

Komponenten · RückmeldungLightbox

Komponente · 6 Varianten

Lightbox

components/Lightbox.astro

Bild oder Video im nativen dialog, Kopfzeile mit Titel oder Zähler, Pfeile als Zeichen, Caption. Kein Backdrop-Schleier.

Notizen

  • Bestand: nichts. Dialog-Muster geteilt.
  • Backdrop transparent wie Dialog, offen.

Props

Name Typ Default Notiz
variant "bild" | "caption" | "pfeile" | "zaehler" | "video" | "hochkant" "bild" 01–06.
surface "nacht" | "paper" "nacht" Pflicht-Paar.
<Lightbox variant="bild" surface="nacht" />

01 · Bild

16:9 im Rahmen

Bild. object-contain.

Nacht

Werkstatt

Paper

Werkstatt

02 · Caption

Satz unter dem Bild

Bild caption. —

Nacht

Werkstatt
Werkstatt, Hamburg. Foto: Nordwynd.

Paper

Werkstatt
Werkstatt, Hamburg. Foto: Nordwynd.

03 · Pfeile

← → in Rahmen

Pagination pfeile. Statisch in v1.

Nacht

Werkstatt

Paper

Werkstatt

04 · Zähler

3 / 12 im Kopf

Pagination. Mono.

Nacht

3 / 12

Paper

3 / 12

05 · Video

Native Controls

Video. poster.

Nacht

Werkstatt

Paper

Werkstatt

06 · Hochkant

3:4, max-h 80vh

Bild hochkant. —

Nacht

Werkstatt

Paper

Werkstatt