From 4fbbeca31b3f699592a93bce599c021b4afc81ec Mon Sep 17 00:00:00 2001 From: Timmske Date: Tue, 24 Mar 2026 21:52:21 +0100 Subject: [PATCH] fix(desktop): eliminate white flash on window resize Set BrowserWindow.backgroundColor to match the active theme so Electron paints the correct color while the renderer catches up during resize. - Add @t3tools/shared/theme as single source of truth for the native window background colors (#161616 dark, #ffffff light). - Read nativeTheme.shouldUseDarkColors at window creation to pick the initial background. - Update all windows via setBackgroundColor when the user switches themes. - Add a synchronous
diff --git a/packages/shared/package.json b/packages/shared/package.json index 02ae794d64..15107252ab 100644 --- a/packages/shared/package.json +++ b/packages/shared/package.json @@ -31,6 +31,10 @@ "./schemaJson": { "types": "./src/schemaJson.ts", "import": "./src/schemaJson.ts" + }, + "./theme": { + "types": "./src/theme.ts", + "import": "./src/theme.ts" } }, "scripts": { diff --git a/packages/shared/src/theme.ts b/packages/shared/src/theme.ts new file mode 100644 index 0000000000..151b00ff33 --- /dev/null +++ b/packages/shared/src/theme.ts @@ -0,0 +1,11 @@ +/** + * Native-window background colors that match the app's CSS theme tokens. + * + * Dark → `color-mix(in srgb, neutral-950 95%, white)` ≈ #161616 + * Light → white + * + * Used by the Electron main process to set `BrowserWindow.backgroundColor` + * so resizing never flashes a mismatched color. + */ +export const THEME_BG_DARK = "#161616"; +export const THEME_BG_LIGHT = "#ffffff";