10c3c43a75
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>
36 lines
1.4 KiB
Markdown
36 lines
1.4 KiB
Markdown
# 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.
|