From 3866ced880a19ef6773d1203f70d8fa3208c4676 Mon Sep 17 00:00:00 2001 From: Temmie Date: Tue, 5 Aug 2025 03:07:32 +0200 Subject: [PATCH] feat: default to light mode if the browser prefers light mode --- utils/loadPreferredThemes.ts | 20 ++++++++++++++++++-- 1 file changed, 18 insertions(+), 2 deletions(-) diff --git a/utils/loadPreferredThemes.ts b/utils/loadPreferredThemes.ts index b342981..cd571b7 100644 --- a/utils/loadPreferredThemes.ts +++ b/utils/loadPreferredThemes.ts @@ -6,8 +6,16 @@ export default function loadPreferredThemes() { const runtimeConfig = useRuntimeConfig() const baseURL = runtimeConfig.app.baseURL; - const currentStyle = settingsLoad().selectedThemeStyle ?? `${baseURL}themes/style/dark.css` - const currentLayout = settingsLoad().selectedThemeLayout ?? `${baseURL}themes/layout/gorb.css` + let currentStyle = settingsLoad().selectedThemeStyle ?? undefined + let currentLayout = settingsLoad().selectedThemeLayout ?? `${baseURL}themes/layout/gorb.css` + + if (!currentStyle) { + if (prefersLight()) { + currentStyle = `${baseURL}themes/style/light.css` + } else { + currentStyle = `${baseURL}themes/style/dark.css` + } + } if (styleLinkElement) { styleLinkElement.href = currentStyle; @@ -33,4 +41,12 @@ function createStyleHead(id: string, themeUrl: string) { href: themeUrl }] }) +} + +function prefersLight(): boolean { + if (window.matchMedia && window.matchMedia('(prefers-color-scheme: light)').matches) { + return true + } + + return false } \ No newline at end of file