docs: multi-theme picker for the Pages site (7 named palettes)#3
Draft
testtest126 wants to merge 1 commit into
Draft
docs: multi-theme picker for the Pages site (7 named palettes)#3testtest126 wants to merge 1 commit into
testtest126 wants to merge 1 commit into
Conversation
Turn the docs-site light/dark toggle into a dropdown picker offering nine themes: the original light and dark plus japanese, arabic, indian, codex, terminal, hebrew, and georgian. Each palette redefines the existing design-system custom properties, so every page picks it up with no markup changes. theme.js builds the menu from the existing .theme-btn on load (all three pages get it for free) and keeps a next-theme cycle on window.__toggleTheme so the inline onclick still degrades gracefully without JS. Selection persists in localStorage and is applied before first paint to avoid a flash. Verified in Chromium (Playwright): all nine palettes apply the expected body background, the menu opens/closes, Escape dismisses it, and the choice survives a reload.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What this is
A new feature, not a fix. The docs site (
docs/) previously had a plain light/dark toggle — the named themes mentioned in the request (Japanese, Arabic, Indian, Codex, Terminal, Hebrew, Georgian) never existed in this repo's history, so there was nothing to "restore." This adds them as a proper picker.What changed
The single theme toggle becomes a dropdown picker offering nine themes:
docs/assets/agent-ready.css— seven new:root[data-theme="…"]palettes that redefine the existing design-system custom properties (so every element re-themes with no markup change), plus styles for the picker menu, options, and per-theme colour swatches.docs/assets/theme.js— builds the dropdown from the existing.theme-btnon load, so all three pages (index,coordination,architecture) get it with zero HTML edits. Selection persists inlocalStorageand applies before first paint to avoid a flash.window.__toggleThemenow cycles to the next theme, so the inlineonclickstill degrades gracefully if JS is unavailable.No markup, installer, or template changes — this is purely additive to the static site.
Verification
Driven end-to-end in Chromium via Playwright (44 assertions, all passing):
bodybackground colour;Screenshots of Japanese, Terminal, Georgian, Codex, and the open menu were eyeballed for contrast and legibility.
🤖 Generated with Claude Code
Generated by Claude Code