Skip to content

feat: dark theme aligned to Script Wizards palette - #4

Merged
ptaranat merged 2 commits into
mainfrom
ptaranat/db-104-align-dlmnwd-web-dark-mode-to-script-wizards-blackorange
Aug 28, 2026
Merged

feat: dark theme aligned to Script Wizards palette#4
ptaranat merged 2 commits into
mainfrom
ptaranat/db-104-align-dlmnwd-web-dark-mode-to-script-wizards-blackorange

Conversation

@ptaranat

@ptaranat ptaranat commented Aug 28, 2026

Copy link
Copy Markdown
Member

Two commits. First: dark theme using the black/orange scheme sampled from the scriptwizards.org homepage (#111111 ground, #ffffff ink, #ffa227 accent, #3d3d3d frames), implemented purely as token overrides on the existing textmode system. Auto via prefers-color-scheme with a data-theme guard, plus a masthead toggle cycling auto/dark/light, persisted to localStorage and applied pre-paint. Print always renders the light palette. Contrast verified at AA. Second: all type set in Departure Mono; Basteleur removed (font files, the font-face rule, NOTICE/README/AGENTS credits), the sheet name uses the wordmark's text-stroke trick instead of synthetic bold, and the colophon credit is trimmed to just the typeface and author. DB-104.

@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Aug 28, 2026

Copy link
Copy Markdown

Deploying dlmnwd with  Cloudflare Pages  Cloudflare Pages

Latest commit: 040a697
Status: ✅  Deploy successful!
Preview URL: https://89516790.dlmnwd.pages.dev
Branch Preview URL: https://ptaranat-db-104-align-dlmnwd.dlmnwd.pages.dev

View logs

@macro-application

Copy link
Copy Markdown

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds a dark theme for the web character generator by overriding existing CSS tokens (Script Wizards black/orange palette), with automatic selection via prefers-color-scheme and a masthead toggle that persists the user’s choice and applies it pre-paint to prevent theme flash. Print output is forced to the light palette, and design docs are updated to describe the token set.

Changes:

  • Add auto → dark → light theme toggle in the web UI, persisted in localStorage.
  • Introduce dark-theme CSS token overrides (plus print-time reassertion of the light palette).
  • Document the new dark theme token values and behavior in DESIGN.md.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.

File Description
web/main.ts Adds theme toggle logic (cycle, apply, persist) and keeps button label/ARIA in sync.
web/index.html Applies stored theme before first paint; adds masthead theme toggle button markup.
web/app.css Adds dark palette token overrides, new shared tokens for shadows/hover, and print-only light palette enforcement.
DESIGN.md Documents dark theme approach, selectors, and token palette/contrast notes.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Comment thread web/app.css Outdated
@ptaranat
ptaranat force-pushed the ptaranat/db-104-align-dlmnwd-web-dark-mode-to-script-wizards-blackorange branch from 040a697 to 2d1ac93 Compare August 28, 2026 14:33
@ptaranat
ptaranat merged commit 2d7fa7c into main Aug 28, 2026
@ptaranat
ptaranat deleted the ptaranat/db-104-align-dlmnwd-web-dark-mode-to-script-wizards-blackorange branch August 28, 2026 14:33
ptaranat added a commit that referenced this pull request Aug 28, 2026
Two commits. First: dark theme using the black/orange scheme sampled
from the scriptwizards.org homepage (#111111 ground, #ffffff ink,
#ffa227 accent, #3d3d3d frames), implemented purely as token overrides
on the existing textmode system. Auto via prefers-color-scheme with a
data-theme guard, plus a masthead toggle cycling auto/dark/light,
persisted to localStorage and applied pre-paint. Print always renders
the light palette. Contrast verified at AA. Second: all type set in
Departure Mono; Basteleur removed (font files, the font-face rule,
NOTICE/README/AGENTS credits), the sheet name uses the wordmark's
text-stroke trick instead of synthetic bold, and the colophon credit is
trimmed to just the typeface and author. DB-104.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants