diff --git a/openspec/tasks/web-ui-spacing-typography-rework.md b/openspec/tasks/web-ui-spacing-typography-rework.md index 1e52cb6..947f444 100644 --- a/openspec/tasks/web-ui-spacing-typography-rework.md +++ b/openspec/tasks/web-ui-spacing-typography-rework.md @@ -13,7 +13,7 @@ tasks ## Implementation Tasks -- [ ] 1. Expand token scale in `apps/web/src/styles/tokens.css` +- [x] 1. Expand token scale in `apps/web/src/styles/tokens.css` - Add `--space-7`, `--space-9`, `--space-12` - Add `--radius-sm`, `--radius-md`, `--radius-lg`, `--radius-xl`, `--radius-full` - Add `--line-height-tight`, `--line-height-normal`, `--line-height-relaxed` @@ -21,30 +21,30 @@ tasks - Add `--touch-target`, `--sidebar-width`, `--mobile-nav-height` - Add a documentation header comment explaining the token naming convention -- [ ] 2. Add button primitives to `apps/web/src/styles/global.css` +- [x] 2. Add button primitives to `apps/web/src/styles/global.css` - `.btn`, `.btn-primary`, `.btn-secondary`, `.btn-sm` - Include `:focus-visible`, `:hover`, and `:disabled` states -- [ ] 3. Add link-button primitive to `apps/web/src/styles/global.css` +- [x] 3. Add link-button primitive to `apps/web/src/styles/global.css` -- [ ] 4. Add form primitives to `apps/web/src/styles/global.css` +- [x] 4. Add form primitives to `apps/web/src/styles/global.css` - `.form-input`, `.form-textarea` - `.checkbox-label` - `.hint` - `.form-error`, `.error-message` -- [ ] 5. Add alert primitives to `apps/web/src/styles/global.css` +- [x] 5. Add alert primitives to `apps/web/src/styles/global.css` - `.alert`, `.alert-error`, `.alert-warning`, `.alert-info` -- [ ] 6. Add loading-state primitive to `apps/web/src/styles/global.css` +- [x] 6. Add loading-state primitive to `apps/web/src/styles/global.css` -- [ ] 7. Add badge primitives to `apps/web/src/styles/global.css` +- [x] 7. Add badge primitives to `apps/web/src/styles/global.css` - `.badge`, `.badge-success`, `.badge-secondary` -- [ ] 8. Add text utility primitives +- [x] 8. Add text utility primitives - `.text-muted` in `global.css` -- [ ] 9. Add mobile detail view styles to `apps/web/src/styles/utilities.css` +- [x] 9. Add mobile detail view styles to `apps/web/src/styles/utilities.css` - `.mobile-detail-view` - `.mobile-detail-header` - `.mobile-detail-header-content` @@ -57,30 +57,30 @@ tasks - `.mobile-detail-field-value` - `.mobile-detail-code` -- [ ] 10. Add mobile list search styles to `apps/web/src/styles/utilities.css` +- [x] 10. Add mobile list search styles to `apps/web/src/styles/utilities.css` - `.mobile-list-search` - `.mobile-list-search-input` -- [ ] 11. Fix mobile nav / FAB / bottom-sheet collisions +- [x] 11. Fix mobile nav / FAB / bottom-sheet collisions - Update `--mobile-nav-height` usage in `utilities.css` and `global.css` - `.start-tool-fab` uses `calc(var(--mobile-nav-height) + var(--space-3))` - `.shell-content.mobile` uses `calc(var(--mobile-nav-height) + var(--space-3))` - `.mobile-edit-actions` uses `var(--mobile-nav-height)` -- [ ] 12. Add visible focus states +- [x] 12. Add visible focus states - Add `:focus-visible` rings for `.nav-item`, `.mobile-nav-item`, `.tab`, `.tree-entry`, `.btn`, `.form-input`, `.form-textarea`, `.link-button` -- [ ] 13. Replace critical inline font-size violations +- [x] 13. Replace critical inline font-size violations - Replace `fontSize: "0.7rem"` in `ConfigProfileListSidebar.tsx` with token-based class - Audit for other `0.7rem` / `10px` / `11px` inline styles and fix -- [ ] 14. Add SSH key page signing/verification styles +- [x] 14. Add SSH key page signing/verification styles - `.key-signing`, `.key-verification`, `.signature-result`, `.verify-result` in `utilities.css` -- [ ] 15. Add profile page avatar styles +- [x] 15. Add profile page avatar styles - `.profile-avatar-section`, `.avatar-preview`, `.avatar-image`, `.avatar-placeholder` in `utilities.css` -- [ ] 16. Verification +- [x] 16. Verification - Run `cd apps/web && npm run typecheck` - Run `cd apps/web && npm run lint` - Search for each previously undefined class and confirm it now has a rule