Theming done
This commit is contained in:
27
openspec/changes/archive/2026-02-11-dch-theming/proposal.md
Normal file
27
openspec/changes/archive/2026-02-11-dch-theming/proposal.md
Normal file
@@ -0,0 +1,27 @@
|
||||
## Why
|
||||
|
||||
Add modern theming controls (dark/light/high-contrast) to improve accessibility and give the site a polished, customizable "WOW" experience.
|
||||
|
||||
## What Changes
|
||||
|
||||
- Add three user-selectable themes: **Dark**, **Light**, and **High Contrast**.
|
||||
- Add a floating theme switcher "notch" on the right edge of the screen:
|
||||
- positioned just below the primary nav bar
|
||||
- leaves enough vertical space for secondary navigation
|
||||
- hover state includes a tasteful animation
|
||||
- Theme switching uses a smooth transition (not an abrupt flash).
|
||||
|
||||
## Capabilities
|
||||
|
||||
### New Capabilities
|
||||
- `site-theming`: Theme tokens and a theme application mechanism that can switch between Dark/Light/High Contrast across the site.
|
||||
- `theme-switcher-notch`: A floating, accessible UI control (right-side notch) that lets the user switch themes.
|
||||
|
||||
### Modified Capabilities
|
||||
- `wcag-responsive-ui`: Extend accessibility baseline to include theme switching requirements (keyboard, focus, reduced motion) and ensure High Contrast theme is supported.
|
||||
|
||||
## Impact
|
||||
|
||||
- Affected UI/CSS: global design tokens (CSS variables), background layers, card/CTA styling, focus styling.
|
||||
- Affected layout: a new floating notch component that must not overlap navigation across breakpoints.
|
||||
- Affected UX/accessibility: keyboard navigation and motion preferences during theme transitions.
|
||||
Reference in New Issue
Block a user