diff --git a/.planning/REQUIREMENTS.md b/.planning/REQUIREMENTS.md index 866f1a0..409795d 100644 --- a/.planning/REQUIREMENTS.md +++ b/.planning/REQUIREMENTS.md @@ -39,7 +39,7 @@ - [ ] **DARK-01**: All wizard step h2 headings are visible (readable text with proper contrast) in dark mode - [ ] **DARK-02**: DeploymentStep native form controls (labels, legends, checkboxes, radios) are visible and styled with semantic tokens in dark mode -- [ ] **DARK-03**: FieldRenderer select element has proper background and text color in dark mode +- [x] **DARK-03**: FieldRenderer select element has proper background and text color in dark mode ## Future Requirements diff --git a/.planning/ROADMAP.md b/.planning/ROADMAP.md index c1b28c9..16941fa 100644 --- a/.planning/ROADMAP.md +++ b/.planning/ROADMAP.md @@ -128,7 +128,7 @@ Plans: 1. All wizard step h2 headings are readable in dark mode with proper contrast 2. DeploymentStep labels, legends, checkboxes, and radios are visible and styled in dark mode 3. FieldRenderer select element has proper background and text color in dark mode -**Plans:** 2 plans +**Plans:** 1/2 plans executed Plans: - [ ] 12-01-PLAN.md — Fix step headings, DeploymentStep form controls, ReviewStep checkbox diff --git a/.planning/STATE.md b/.planning/STATE.md index 45a7783..7a94f82 100644 --- a/.planning/STATE.md +++ b/.planning/STATE.md @@ -3,14 +3,14 @@ gsd_state_version: 1.0 milestone: v1.2 milestone_name: UI Polish & Clarity status: completed -stopped_at: Completed 11-02-PLAN.md -last_updated: "2026-04-01T11:35:59.058Z" +stopped_at: Completed 12-02-PLAN.md +last_updated: "2026-04-01T12:05:08.887Z" last_activity: 2026-04-01 — Phase 11 plan 02 complete (POLISH-03, POLISH-04 satisfied) progress: - total_phases: 4 + total_phases: 6 completed_phases: 4 - total_plans: 12 - completed_plans: 12 + total_plans: 14 + completed_plans: 13 percent: 100 --- @@ -69,6 +69,12 @@ Recent decisions affecting current work: - [Phase 11-polish-responsiveness]: FieldRenderer select uses focus-visible:ring-2 (not focus:ring-2) for keyboard-only ring on selects - [Phase 11-polish-responsiveness]: CSS-only reduced-motion guard via @media (prefers-reduced-motion: reduce) — no JS listener needed - [Phase 11-polish-responsiveness]: key={state.currentStep} on step wrapper forces React remount triggering CSS animation from initial state +- [Phase 12-dark-mode-visibility-fixes]: bg-surface-container text-on-surface added to FieldRenderer select className — semantic tokens ensure correct rendering in both light and dark themes without dark: prefix + +### Roadmap Evolution + +- Phase 12 added: Dark mode visibility fixes +- Phase 13 added: Add remaining RClone remotes ### Pending Todos @@ -80,6 +86,6 @@ None yet. ## Session Continuity -Last session: 2026-04-01T11:32:08.126Z -Stopped at: Completed 11-02-PLAN.md +Last session: 2026-04-01T12:05:08.885Z +Stopped at: Completed 12-02-PLAN.md Resume file: None diff --git a/.planning/phases/12-dark-mode-visibility-fixes/12-02-SUMMARY.md b/.planning/phases/12-dark-mode-visibility-fixes/12-02-SUMMARY.md new file mode 100644 index 0000000..47535da --- /dev/null +++ b/.planning/phases/12-dark-mode-visibility-fixes/12-02-SUMMARY.md @@ -0,0 +1,89 @@ +--- +phase: 12-dark-mode-visibility-fixes +plan: 02 +subsystem: ui +tags: [tailwind, dark-mode, select, semantic-tokens, FieldRenderer] + +# Dependency graph +requires: + - phase: 12-dark-mode-visibility-fixes + provides: dark mode semantic token CSS variables established in 12-01 +provides: + - Select dropdowns in FieldRenderer readable in dark mode via bg-surface-container text-on-surface +affects: [RemoteConfigStep, any page rendering select via FieldRenderer] + +# Tech tracking +tech-stack: + added: [] + patterns: [semantic token classes on native HTML select elements for dark mode compatibility] + +key-files: + created: [] + modified: + - src/components/ui/FieldRenderer.tsx + +key-decisions: + - "bg-surface-container text-on-surface added to select className — semantic tokens ensure correct rendering in both light and dark themes without dark: prefix" + +patterns-established: + - "Native select elements require explicit bg and text semantic token classes — browser default white background overrides dark mode cascade otherwise" + +requirements-completed: [DARK-03] + +# Metrics +duration: 1min +completed: 2026-04-01 +--- + +# Phase 12 Plan 02: FieldRenderer Select Dark Mode Fix Summary + +**Select dropdowns in FieldRenderer now use bg-surface-container and text-on-surface semantic tokens, fixing browser-imposed white background in dark mode** + +## Performance + +- **Duration:** ~1 min +- **Started:** 2026-04-01T14:03:23Z +- **Completed:** 2026-04-01T14:04:05Z +- **Tasks:** 1 +- **Files modified:** 1 + +## Accomplishments +- Added `bg-surface-container text-on-surface` to the select element's className in FieldRenderer.tsx +- Fixed invisible text in select dropdowns when app is in dark mode (browser was applying native white background) +- Full test suite (204 tests, 16 files) passes with zero regressions + +## Task Commits + +Each task was committed atomically: + +1. **Task 1: Add dark mode classes to FieldRenderer select element** - `94e90e0` (feat) + +## Files Created/Modified +- `src/components/ui/FieldRenderer.tsx` - Added `bg-surface-container text-on-surface` to select element className + +## Decisions Made +None - followed plan as specified. The two semantic token classes were added exactly as prescribed, without touching option elements or border/error conditional logic. + +## Deviations from Plan + +None - plan executed exactly as written. + +## Issues Encountered +None. + +## User Setup Required +None - no external service configuration required. + +## Next Phase Readiness +- FieldRenderer select elements are now fully dark-mode compatible +- Remaining dark mode fixes (if any) in phase 12 can proceed independently +- Phase 13 (Add remaining rclone remotes) is unblocked + +--- +*Phase: 12-dark-mode-visibility-fixes* +*Completed: 2026-04-01* + +## Self-Check: PASSED +- FOUND: src/components/ui/FieldRenderer.tsx (contains bg-surface-container text-on-surface) +- FOUND: .planning/phases/12-dark-mode-visibility-fixes/12-02-SUMMARY.md +- FOUND: commit 94e90e0