What
The marketing website currently only supports dark mode. Add light mode support that respects `prefers-color-scheme`.
Current state
- `website/index.html` uses CSS custom properties (`--bg`, `--text`, etc.) defined in `:root`
- All colors are dark theme (dark backgrounds, light text)
- No `@media (prefers-color-scheme: light)` rules exist
Approach
- Add a `@media (prefers-color-scheme: light)` block in the `<style>` section
- Override the CSS custom properties with light-mode values
- Ensure the Mando SVGs (which have hardcoded dark outlines) still look good on light backgrounds
Example light palette:
```css
@media (prefers-color-scheme: light) {
:root {
--bg: #FAFAF8;
--surface: #FFFFFF;
--border: #E5E0DA;
--text: #1A1612;
--text-dim: #5C5248;
--text-muted: #8A7A6A;
/* ... etc */
}
}
```
Files to modify
- `website/index.html` — add light mode CSS variables + any element-specific overrides
Acceptance criteria
What
The marketing website currently only supports dark mode. Add light mode support that respects `prefers-color-scheme`.
Current state
Approach
Example light palette:
```css
@media (prefers-color-scheme: light) {
:root {
--bg: #FAFAF8;
--surface: #FFFFFF;
--border: #E5E0DA;
--text: #1A1612;
--text-dim: #5C5248;
--text-muted: #8A7A6A;
/* ... etc */
}
}
```
Files to modify
Acceptance criteria