Skip to content

Live-reload the active theme's stylesheets when they change on disk - #2803

Open
0xApotheosis wants to merge 1 commit into
Foundry376:masterfrom
0xApotheosis:theme-styles-live-reload
Open

Live-reload the active theme's stylesheets when they change on disk#2803
0xApotheosis wants to merge 1 commit into
Foundry376:masterfrom
0xApotheosis:theme-styles-live-reload

Conversation

@0xApotheosis

@0xApotheosis 0xApotheosis commented Aug 18, 2026

Copy link
Copy Markdown

Description

Watches the active theme package's styles/ directory and recompiles LESS when a stylesheet changes on disk, so a running Mailspring restyles without a restart.

The driver for this is theme syncing on Omarchy (Arch/Hyprland): a theme-set hook regenerates a Mailspring theme package from the OS palette whenever the system theme changes. OS dark/light flips already apply live, but switching between two dark themes rewrites the LESS under the same package name, and the running app doesn't pick that up until relaunch. This closes that gap. It also gives theme developers live iteration - edit, save, see it.

Notes:

  • The watcher re-attaches in activateThemePackage(), so it follows automatic light/dark resolution.
  • .asar paths are skipped - packaged themes can't change at runtime. In practice only themes in ~/.config/Mailspring/packages (and source-tree themes in dev mode) are watched.
  • Events are debounced 100ms since theme generators rewrite several files in quick succession; non-stylesheet events (editor/sed temp files) are filtered by extension.
  • Known limit: adding a brand-new stylesheet file to an active theme still needs a re-activation. Content changes to existing stylesheets apply live.

Verification

  • Edited the active theme's ui-variables.less on disk - the running main window restyled in ~200ms, no restart (Linux, Wayland/Hyprland, real account).
  • sed -i temp-file events were filtered, and multi-file rewrites collapsed into one recompute.
  • Theme switching, automatic light/dark resolution, and onboarding (forceBaseTheme) behave as before.
  • npm run lint and tsc --noEmit pass.

🤖 Generated with Claude Code

ThemeManager now watches the active theme package's styles directory and
recompiles LESS when a stylesheet changes, so edits made outside the app
appear in running windows without a restart. This helps theme developers
iterate without relaunching, and lets external tools that generate themes
(e.g. syncing the OS color palette) apply changes live.

Packaged themes inside the app archive are skipped: the archive cannot be
watched and never changes at runtime. Events are debounced since theme
generators typically rewrite several files in quick succession.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
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.

1 participant