Files

T

Bernt 3335edeed8 docs: Semantic Color System v1.0

- SEMANTIC_COLOR_SYSTEM.md (v1.0, DRAFT):
  - Three-layer architecture: Primitive → Semantic → Component Alias
  - Naming convention: color.{category}.{role}
  - Semantic tokens with contracts (purpose, allowed, not allowed):
    - Action colors (primary, secondary, ghost, disabled)
    - Surface colors (default, raised, overlay, inverted)
    - Text colors (primary, secondary, muted, inverted, link)
    - Border colors (default, focus, error, success)
    - Status colors (success, warning, danger, info)
    - Brand colors (primary, secondary)
  - State Matrix: all states for Button, Input, Select, Card with
    background, border, text, icon mappings
  - Component Aliases: button.*, input.*, select.*, card.* mapped
    to semantic tokens
  - Dark Mode: token value swapping without component code changes
  - Validation: component token audit (0 direct color references)

- COMPLIANCE_MATRIX.md: Semantic Color System 70%

Rationale: Semantic model first, not colors. Components never reference
primitives directly. Every token has a contract (purpose, allowed, forbidden).
Dark mode via token swap. State matrix derived from existing components.

2026-07-02 10:53:42 +00:00

3.4 KiB

Raw Blame History

COMPLIANCE MATRIX

Component Readiness Tracking


Version	1.0
Status	DRAFT — Updated as components are specified

Legend

Symbol	Meaning
✅	Complete
🟡	Partial / In Progress
⏳	Not Started
❌	Not Applicable

Tier 1 — Canonical Components

Component	Governance	Tokens	Motion	Accessibility	AI	QA	Overall
Button	✅	✅	✅	🟡	✅	⏳	82%
Input	🟡	🟡	🟡	🟡	✅	⏳	33%
Select	🟡	🟡	🟡	🟡	✅	⏳	33%
Card	🟡	🟡	🟡	🟡	✅	⏳	33%
Modal	⏳	⏳	⏳	⏳	⏳	⏳	0%
Navigation	⏳	⏳	⏳	⏳	⏳	⏳	0%
Table	⏳	⏳	⏳	⏳	⏳	⏳	0%
Data Grid	⏳	⏳	⏳	⏳	⏳	⏳	0%
Search	⏳	⏳	⏳	⏳	⏳	⏳	0%
Map Panel	⏳	⏳	⏳	⏳	⏳	⏳	0%

Tier 2 — Derived Components

Component	Governance	Tokens	Motion	Accessibility	AI	QA	Overall
Badge	⏳	⏳	⏳	⏳	⏳	⏳	0%
Alert	⏳	⏳	⏳	⏳	⏳	⏳	0%
Toast	⏳	⏳	⏳	⏳	⏳	⏳	0%
Tooltip	⏳	⏳	⏳	⏳	⏳	⏳	0%
Accordion	⏳	⏳	⏳	⏳	⏳	⏳	0%
Tabs	⏳	⏳	⏳	⏳	⏳	⏳	0%
Breadcrumb	⏳	⏳	⏳	⏳	⏳	⏳	0%
Pagination	⏳	⏳	⏳	⏳	⏳	⏳	0%
Empty State	⏳	⏳	⏳	⏳	⏳	⏳	0%
Skeleton	⏳	⏳	⏳	⏳	⏳	⏳	0%

Tier 3 — Domain Components

Component	Governance	Tokens	Motion	Accessibility	AI	QA	Overall
KPI Card	⏳	⏳	⏳	⏳	⏳	⏳	0%
Map Overlay Panel	⏳	⏳	⏳	⏳	⏳	⏳	0%
Layer Selector	⏳	⏳	⏳	⏳	⏳	⏳	0%
Mission Status	⏳	⏳	⏳	⏳	⏳	⏳	0%
Dataset Card	⏳	⏳	⏳	⏳	⏳	⏳	0%
Geospatial Inspector	⏳	⏳	⏳	⏳	⏳	⏳	0%
Asset Summary	⏳	⏳	⏳	⏳	⏳	⏳	0%
Coordinate Picker	⏳	⏳	⏳	⏳	⏳	⏳	0%
Timeline Panel	⏳	⏳	⏳	⏳	⏳	⏳	0%

Foundation Documents

Document	Status	Completeness
Design Constitution	✅	100%
Token Philosophy	✅	100%
Design Specification	🟡	70%
Component Template	✅	100%
Component Decision Tree	✅	100%
AI Design Principles	✅	100%
Design Anti-Patterns	✅	100%
Glossary	✅	100%
Release Definition	🟡	80%
Brand Palette	🟡	40%
Grid & Elevation	🟡	60%
Semantic Color System	🟡	70%

How to Update

When a component is specified, update this matrix:

Mark completed sections as ✅
Calculate overall percentage
Update this file in same PR as component spec

ÄNDRINGSHISTORIA

Version	Datum	Beskrivning
1.0	2026-07-02	Initial compliance matrix with all components and foundation documents

STATUS

DRAFT — Updated as work progresses

3.4 KiB Raw Blame History

COMPLIANCE MATRIX

Legend

Tier 1 — Canonical Components

Tier 2 — Derived Components

Tier 3 — Domain Components

Foundation Documents

How to Update

ÄNDRINGSHISTORIA

STATUS

3.4 KiB

Raw Blame History