Styleguide
Elemente & Module.
Alle Komponenten von Creuva auf einen Blick – Contao-Standardelemente, Creuva-Elemente, Templatevarianten und Klassen.
Überschrift H1
Überschrift H2
Überschrift H3
DachzeileÜberschrift mit Dachzeile
Zweifarbige Überschrift mit Akzent.
Text & Rich Text
Ein einleitender Absatz mit der Klasse u-lead.
Fließtext mit fetter und kursiver Auszeichnung, einem Link, Hervorhebung und Code.
- Liste mit Häkchen
- Zweiter Punkt
- Nummerierte Liste
- Zweiter Punkt
Ein Zitat im Fließtext.
Text mit Bild links
Das Bild steht ab Tablet-Breite links neben dem Text, auf dem Smartphone darüber.
- Bildposition im Element wählbar
- Abgerundete Ecken über das Design
Aufzählung
- Responsives Design
- Barrierearme Gestaltung
- Contao 5.7 und 6
Beschreibungsliste
- Theme
- Creuva
- Version
- 1.0
- Contao
- 5.7 und 6
Tabelle
| Spalte A | Spalte B | Spalte C |
|---|---|---|
| Wert 1 | Wert 2 | Wert 3 |
| Wert 4 | Wert 5 | Wert 6 |
Akkordeon
Inhalt des ersten Eintrags.
Inhalt des zweiten Eintrags.
Text-ElementTemplatevarianten
creuva_card
Karte
Bild, Kategorie (Subline), Titel und Text. Der letzte Link macht die ganze Karte klickbar.
Icon-Box
Variante creuva_feature mit kleinem Icon (SVG oder Bild).
Das Zitat steht im Text, Name und Funktion in Überschrift und Subline.
Teammitglied
Variante creuva_team
Porträt, Name, Funktion und Kontakt.
BeschreibungslisteTemplatevarianten
Kennzahlen (creuva_stats)
- 120+
- Projekte
- 98 %
- Zufriedenheit
- 15
- Jahre
Timeline (creuva_timeline)
- 2024
- Idee
- 2025
- Entwicklung
- 2026
- Launch
ErweiterungenTheme Components Bundle
Simplebox
Hinweisbox aus dem Theme Components Bundle (Templatevariante des Text-Elements).
CSS-KlassenHintergründe & Abstände
u-bg-muted
Dezenter Hintergrund.
u-bg-accent
Akzentfarbe, hell.
u-bg-primary
Primärfarbe mit Kontrasttext.
u-card
Karte mit Rahmen und Schatten.
u-full-bleed
Hintergrund über die volle Fensterbreite, Inhalt bleibt im Raster.