Fix dark mode in the dev test server - #45
Merged
Merged
Conversation
The dev harness did not fully honor dark mode: - dev/testActivity.json pinned DoenetML 0.7.4, so each embedded DoenetViewer loaded a @doenet/standalone bundle that predates dark mode. The iframe body was darkened but the document text stayed in light-mode colors (black-on-black). Bump to 0.7.20-dev.332, the latest dev build, which includes dark-mode support and matches the installed @doenet/doenetml-iframe. The stable 0.7.20 release predates the dark-mode work, so it is not sufficient. - dev/App.tsx: theme the harness chrome to follow the selected darkMode instead of being hardcoded light. Theme the header box and controls, sync the page backdrop to the viewer's --canvas color so the area around the activities matches, and pin the chrome buttons' colors to the selection (dev/index.css keys button backgrounds off the OS prefers-color-scheme, which drifted out of sync and produced white-on-white). Dev-only; no changes to shipped code under src/. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
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
1 participant
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.
Summary
Completes the dark-mode support started in #32 for the dev test server, which had two gaps. All changes are dev-only (under
dev/); nothing shipped undersrc/changes.Embedded documents rendered black-on-black
dev/testActivity.jsonpinned DoenetML0.7.4, so each embeddedDoenetVieweriframe loaded a@doenet/standalonebundle that predates dark mode. The iframe wrapper darkened the iframe body, but the document's own text stayed in light-mode colors → black-on-black.Bumped all documents to
0.7.20-dev.332— the latest dev build, which includes the dark-mode work and matches the installed@doenet/doenetml-iframe@0.7.20-dev.332. (The stable0.7.20release predates the dark-mode work, so it is not sufficient.)Dev harness chrome stayed light
dev/App.tsxnow themes the harness chrome to follow the selecteddarkMode:--canvas(#121212) so the area around/below the activities matches instead of showing a lighter black.dev/index.csskeys<button>backgrounds off the OSprefers-color-scheme, which drifted out of sync with the selection (white background under a dark selection → white-on-white).🤖 Generated with Claude Code