From 93f369034429dd10f8a810e2614ce88cf8d4afd8 Mon Sep 17 00:00:00 2001 From: MartinBraquet Date: Sat, 18 Oct 2025 22:43:17 +0200 Subject: [PATCH] Speed up init theme --- web/hooks/use-theme.ts | 4 +--- web/public/init-theme.js | 3 +-- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/web/hooks/use-theme.ts b/web/hooks/use-theme.ts index 39612ffa..414a5b06 100644 --- a/web/hooks/use-theme.ts +++ b/web/hooks/use-theme.ts @@ -40,9 +40,7 @@ const reRenderTheme = () => { const theme: theme_option | null = JSON.parse(localStorage.getItem('theme') ?? 'null') ?? 'auto' - const autoDark = window.matchMedia('(prefers-color-scheme: dark)').matches - - if (theme === 'dark' || (theme !== 'light' && autoDark)) { + if (theme === 'dark' || (theme !== 'light' && window.matchMedia('(prefers-color-scheme: dark)').matches)) { document.documentElement.classList.add('dark') } else { document.documentElement.classList.remove('dark') diff --git a/web/public/init-theme.js b/web/public/init-theme.js index ebbee053..50b667d9 100644 --- a/web/public/init-theme.js +++ b/web/public/init-theme.js @@ -1,10 +1,9 @@ // run this in as blocking to prevent flash of unstyled content. See theme-provider.tsx { - const autoDark = window.matchMedia('(prefers-color-scheme: dark)').matches const localTheme = localStorage.getItem('theme') const theme = localTheme ? JSON.parse(localTheme) : 'auto' - if (theme === 'dark' || (theme === 'auto' && autoDark)) { + if (theme === 'dark' || (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches)) { document.documentElement.classList.add('dark') } }