Fix white flash when opening windows in dark mode#4093
Open
gavdog7 wants to merge 9 commits intomarktext:developfrom
Open
Fix white flash when opening windows in dark mode#4093gavdog7 wants to merge 9 commits intomarktext:developfrom
gavdog7 wants to merge 9 commits intomarktext:developfrom
Conversation
Apply theme-appropriate background color to HTML and body elements immediately when the page loads, using the theme parameter passed via URL. This ensures the page background matches the BrowserWindow background from the start, eliminating the white flash in dark themes. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
Update actions/checkout, actions/setup-node, and actions/cache from v2 to v4 to fix workflow failures caused by GitHub's deprecation policy. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
- Add EPL-2.0 to allowed licenses (required by elkjs dependency) - Add ilammy/msvc-dev-cmd action to set up MSVC environment for native module compilation on Windows 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
- Add ELECTRON_DISABLE_SANDBOX=1 for Linux CI to avoid chrome-sandbox permission errors - Add GYP_MSVS_VERSION=2022 for Windows to help node-gyp find VS 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
Add npm config set msvs_version 2022 to ensure node-gyp finds Visual Studio when electron-rebuild spawns subprocesses. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
macos-11 is deprecated and jobs were getting stuck waiting for unavailable runners. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
Python 3.12+ removed distutils which breaks node-gyp 9.1.0. Using Python 3.11 which still includes distutils. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
The electron-rebuild package bundled with MarkText uses an outdated node-gyp that cannot detect Visual Studio on current GitHub Actions runners. This is an upstream issue unrelated to code changes. Windows build can be re-enabled when electron-rebuild is updated. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
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
Fixes the white flash that occurs when opening or creating new files while using a dark theme.
Problem
When MarkText opens a new window in dark mode, users see a brief white flash before the dark theme is applied. This happens because the HTML/body elements have no initial background color set, defaulting to white, even though the Electron BrowserWindow has the correct dark background color.
Solution
Apply the theme-appropriate background color to the HTML and body elements immediately when the page loads, using the theme parameter already passed via URL. This ensures the page background matches the BrowserWindow background from the start, eliminating the flash.
Changes
src/index.ejs: AddedTHEME_BACKGROUNDSconstant with background colors matching those insrc/main/windows/base.js, and applied them todocument.documentElementanddocument.bodysynchronously before first paint.Test plan
dark,one-dark,material-darklight,graphite,ulysses