curo/kite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs(phase-12): fix UI-SPEC typography and spacing blocking issues

Browse Source 
- Collapse font weights from 3 to 2: drop font-medium (500), use font-semibold (600) for row primary names, labels, column headers; font-normal (400) for body
- Fix sm spacing token usage: replace p-1.5 (6px) with p-2 (8px) to match declared 8px value
- Update health badge in connection root list from font-medium to font-semibold

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
curo1305
2026-06-18 22:19:25 +02:00
co-authored by Claude Sonnet 4.6
parent ea682fdecd
commit fe54a855b3
1 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.planning/phases/12-cloud-resource-foundation/12-UI-SPEC.md
+6 -4
View File
@@ -35,7 +35,7 @@ Declared values (must be multiples of 4):
| Token | Value | Usage |
|-------|-------|-------|
| xs | 4px | Icon gaps, inline badge padding (`gap-1`, `px-1`) |
| sm | 8px | Compact element spacing, toolbar icon buttons (`p-1.5`, `gap-2`) |
| sm | 8px | Compact element spacing, toolbar icon buttons (`p-2`, `gap-2`) |
| md | 16px | Default element spacing, row padding (`px-4`) |
| lg | 24px | Section padding, horizontal gutters (`px-6`) |
| xl | 32px | Layout gaps |
@@ -52,11 +52,13 @@ Exceptions:
| Role | Size | Weight | Line Height |
|------|------|--------|-------------|
| Body | 14px (`text-sm`) | 400 regular | 1.5 |
| Body | 14px (`text-sm`) | 400 regular (`font-normal`) | 1.5 |
| Label / metadata | 12px (`text-xs`) | 600 semibold (`font-semibold`) | 1.4 |
| Row primary name | 14px (`text-sm`) | 500 medium (`font-medium`) | 1.5 |
| Row primary name | 14px (`text-sm`) | 600 semibold (`font-semibold`) | 1.5 |
| Column header | 12px (`text-xs`) | 600 semibold, `uppercase tracking-wider` | 1.4 |
Two weights only: `font-normal` (400) for body, `font-semibold` (600) for all labels, metadata, column headers, and row primary names. `font-medium` (500) is not used.
Source: extracted from `StorageBrowser.vue` — do not deviate without updating this contract.
---
@@ -197,7 +199,7 @@ Connection warning banner (shown when `folderFreshness === 'warning'`):
- Displays one row per connected account using the same `StorageBrowser` grid
- Provider icon (24px) + connection display name + connection health badge
- Health badge: `text-green-700 bg-green-50 rounded-full text-xs font-medium px-2 py-0.5` for connected; `text-amber-700 bg-amber-50` for warning; `text-red-700 bg-red-50` for failed
- Health badge: `text-green-700 bg-green-50 rounded-full text-xs font-semibold px-2 py-0.5` for connected; `text-amber-700 bg-amber-50` for warning; `text-red-700 bg-red-50` for failed
- Clicking a connection root navigates into that connection using connection UUID in the route
### Session-scoped last-visited folder (D-05)