Ship the full Communication portal (real SMS API, feature-locked future channels), BFF proxy, docs, snapshot, and phase handover. Co-authored-by: Cursor <cursoragent@cursor.com>
1.4 KiB
1.4 KiB
Communication — Design System
Tokens
Defined in frontend/modules/communication/design-system/tokens.ts and CSS variables in frontend/styles/globals.css:
| Token | Light | Purpose |
|---|---|---|
--communication-accent |
#6366f1 |
Primary indigo |
--communication-accent-soft |
rgba indigo 12% | Backgrounds |
--communication-success |
#059669 |
Delivered / healthy |
--communication-warning |
#d97706 |
Queued / deferred |
--communication-danger |
#dc2626 |
Failed / circuit open |
Dark mode variants in .dark block.
Principles
- RTL first —
dir="rtl"on portal shell - Mobile first — collapsible sidebar, responsive grids
- Dark mode ready — ColorModeProvider toggle in header
- Accessible — aria labels on nav, semantic tables
- Omnichannel ready — channel badges from
/capabilities
Reuse policy
Use frontend/shared/ and @/src/shared/ui — do not fork Button/Input/Dialog. Module-specific styling via --communication-* tokens only.
Status vocabulary
messageStatusLabels / messageStatusTone in tokens.ts map backend statuses (queued, sent, delivered, failed, …) to Badge tones.
Locked module UI
Feature lock pages use gradient hero, capability checklist, integration badges, and placeholder preview panel — consistent premium finish without functional actions.