Define mandatory modular CSS conventions for styleguide

2026-05-27 16:58:02 +02:00
parent e97dd47769
commit b680c09d85
1 changed files with 21 additions and 0 deletions
@@ -34,6 +34,27 @@ Foundations / Grundlagen
 Jede neue oder geänderte Lösung muss der passenden Ebene zugeordnet werden; Component- und Pattern-Kapitel dokumentieren dabei die semantischen Tokens, die dort verwendet werden.
 ## Modul-CSS-Konvention (verbindlich)
 Wenn der Styleguide modularisiert ist (z. B. `styles/*.css`), gelten zusätzlich:
 - `styleguide.css` ist der einzige CSS-Einstiegspunkt und enthält ausschließlich die verbindliche `@import`-Reihenfolge.
 - Neue CSS-Datei nur anlegen, wenn eine klar abgegrenzte fachliche Verantwortung entsteht (z. B. neues Pattern, neues Layout, neue Page/Template-Sektion). Bestehende Verantwortung wird in bestehender Datei erweitert.
 - Foundations und semantische Tokens werden zentral gepflegt (Foundations + semantische Token-Definitionen in `styleguide.css`/zentralem Token-Bereich), nicht verteilt über Pattern-/Layout-Dateien.
 - Components, Patterns, Layouts und Templates liegen in eigenen Moduldateien der jeweiligen Ebene; keine Vermischung fachfremder Ebenen in einer Datei.
 - Nomenklatur neuer Moduldateien:
  - Dateiname klein, kebab-case, ASCII.
  - Präfix mit Ordnungsgruppe, z. B. `01-`, `10-`, `20-`, `30-`, `40-`.
  - Danach Ebenenbezug + fachlicher Name, z. B. `22-patterns-object-card.css`.
 - Neue oder umbenannte Moduldateien müssen im selben Change-Set in `styleguide.css` per `@import` ergänzt/aktualisiert werden.
 - Import-Reihenfolge bleibt strikt kaskadierend:
  - Foundations/Base/Helpers
  - Components
  - Patterns
  - Layouts
  - Templates/Pages
 - Pro Datei genau ein primärer fachlicher Verantwortungsbereich; Sammel-/Restdateien ohne klare Verantwortung sind zu vermeiden.
 ## Ebenenregeln
 ### Foundations