fix(desktop): seed full cached theme vars in boot script

The cold-boot inline script in index.html applied only the cached
--background and the light/dark class before React mounts. The restored
setup loading gate's grainient reads other theme vars too (--chart-5,
--chart-3, --chart-2, --primary, --foreground), so a cached non-Latte
theme (houston/buzz/custom) painted the splash grainient from the static
Catppuccin :root values until ThemeProvider.applyCachedVars() ran on
mount — a brief wrong-colored splash.

Seed the full cached vars map on documentElement synchronously, mirroring
ThemeProvider.applyCachedVars(), so the pre-React paint matches the themed
gate for any cached theme.

Follow-up to #1631 review.
This commit is contained in:
npub13fn4ahfnvaa2qwylvegdgeajqs0mph6v4qsw4jcqnw4mjh3hzh2quuucm5
2026-07-09 09:22:36 +01:00
parent e0f76b0e9c
commit 92caf40966
+16 -2
View File
@@ -27,7 +27,7 @@
</style>
<script>
(() => {
var cached, bg, parsed;
var cached, bg, parsed, vars, key;
try {
cached = window.localStorage.getItem("buzz-theme-cache");
if (!cached) {
@@ -38,7 +38,21 @@
return;
}
parsed = JSON.parse(cached);
bg = parsed.vars["--background"];
// Seed the full cached vars map on <html> before paint, mirroring
// ThemeProvider.applyCachedVars(). The loading gate's grainient reads
// --chart-*, --primary, --foreground, etc. — not just --background —
// so seeding only --background would let a cached non-Latte theme
// (houston/buzz/custom) paint the splash from the static Catppuccin
// :root vars until React mounts.
vars = parsed.vars;
if (vars) {
for (key in vars) {
if (Object.hasOwn(vars, key)) {
document.documentElement.style.setProperty(key, vars[key]);
}
}
}
bg = vars && vars["--background"];
if (bg) document.documentElement.style.backgroundColor = `hsl(${bg})`;
// Match the cached light/dark class so themed vars resolve correctly
// before ThemeProvider mounts.