Startpunkt / Gesundheit
Feature-Eintrag 7/5
Ein hervorgehobener Eintrag mit Bild, Kicker, Überschrift und kurzem Vorspann.
System
Komponenten & Inhaltsbausteine
Diese Seite rendert alle Bausteine des CannaMag-Themes im echten visuellen System. Sie ist mit noindex, follow markiert und dient der Qualitätssicherung.
Grundlagen
Display
Überschrift H3 — Barlow Condensed
Überschrift H4
Fließtext in Source Sans 3. Fett, kursiv, unterstrichen,durchgestrichen und Inline-Code. Ein Beispiel-Linkzeigt die Zustände Standard, Hover und Fokus.
Primary / Pinie
--color-primary#12372A — Kopf, starke Linien
Sekundär / Salbei
--color-secondary#D8E6DD — ruhige Flächen
Akzent / Marker
--color-accent#DFFF4F — aktiver Index
Hintergrund / Papier
--color-background#F5F3EC — Seitenfläche
Text / Kohle
--color-foreground#191D1B — Fließtext
Gedämpft / Flechte
--color-muted#626C65 — Metadaten
Rahmen / Graphit
--color-border#B8C0BA — Haarlinien
Destruktiv
--color-destructive#A62D2D — Fehler, Warnung
Buttons & Aktionen
Listen & Karten
Wissen · 18.07.2022
Standard-Listeneintrag mit Bild
Bild links, Metadaten vor der Überschrift, kurzer Auszug.
Rechtslage · 31.05.2022
Text-only Eintrag ohne Bild
Für Rhythmus ohne vorhandenes Bild — nie ein Bild künstlich verstecken.
Inhaltsbausteine (CMS-Prosa)
Ein Absatz aus portablen CMS-Blöcken. Enthält einen Link und Inline-Code.
Abschnitts-Überschrift (H2)
Unter-Überschrift (H3)
- Ungeordneter Punkt eins
- Verschachtelter Punkt
- Ungeordneter Punkt zwei
- Geordneter Schritt eins
- Geordneter Schritt zwei
Ein Zitat setzt einen ruhigen, redaktionellen Akzent.
const wirkung = "nicht berauschend";| Produktform | Anwendung | Hinweis |
|---|---|---|
| Öl | oral | mg pro Tropfen prüfen |
| Kapsel | oral | feste Dosierung |
| Creme | äußerlich | Inhaltsstoffe lesen |
Strukturierte Module
Rezept auf einen Blick
Anleitung in Schritten
- Vorbereiten. Zutaten und Menge prüfen.
- Umsetzen. Schritt für Schritt vorgehen.
- Kontrollieren. Ergebnis und Angaben abgleichen.
Häufige Fragen
Ist das erste Element geöffnet?
Ja, ein offenes und zwei geschlossene Elemente als Zustandsreferenz.
Funktioniert das ohne JavaScript?
Ja, native <details>/<summary> ohne Skript.
Ist das Ziel groß genug?
Die Zusammenfassung hat ein Ziel von mindestens 44 px Höhe.
Formulare (nur Zustände)
Hinweis: Vor dem Launch muss ein rechtlich freigegebener Datenschutzhinweis verlinkt werden.