 Bernt
|
13fea4a301
|
docs: Brand Palette + Grid & Elevation + Compliance Matrix update
- BRAND_PALETTE.md (v1.0, DRAFT):
- Token-specifikation (not a color list)
- Semantic brand tokens: primary, secondary, tertiary
- 12-step scale (50-950) with defined purposes
- Usage rules: where brand colors are used (logo, buttons, focus, links)
- Usage rules: where brand colors are NOT used (status, data viz, maps)
- Dark mode strategy: shift lighter in dark mode
- Contrast requirements: WCAG AA 4.5:1 for text, 3:1 for large text/focus
- Placeholder values: awaiting brand color definition from Erik/Landvex
- Token dependencies from components: Button, Input, Select, Link, Loading, Progress
- Governance: no new brand colors without Architecture Review
- GRID_ELEVATION.md (v1.0, DRAFT):
- Spacing scale: 13 primitive tokens (space-0 to space-12)
- Semantic spacing: gap-xs to gap-xl, padding/margin tokens
- Grid system: 12-column, responsive (4/8/12 columns)
- Common layouts: full, two-column, three-column, four-column, sidebar, asymmetric
- Border radius: 6 tokens (none to full) with component mapping
- Elevation system: 5 shadow levels + 8 z-index levels
- Component elevation mapping: resting, hover, active states
- Responsive breakpoints: xs to 2xl (Tailwind-compatible)
- Density principles: compact/default/comfortable (75%/100%/125%)
- Z-index scale: 8 levels with rules
- Token dependencies from components: Card, Button, Input, Select, Modal, Table, Tag, Page, Section
- COMPLIANCE_MATRIX.md: Brand Palette 40%, Grid & Elevation 60%
Rationale: Brand Palette driven by component token usage, not vice versa.
Grid & Elevation validated against Card and other components. Foundations
now complete enough to raise component maturity.
|
2026-07-02 10:51:59 +00:00 |
|