fix theme sync

JSPaste · Feb 12, 2025 · 06c17e4 · 06c17e4
1 parent 71af426
commit 06c17e4
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 3 deletions.
diff --git a/www/src/components/modals/settings/ThemeSection.tsx b/www/src/components/modals/settings/ThemeSection.tsx
@@ -42,7 +42,7 @@ export default function ThemeSection() {
 					<input
 						type='checkbox'
 						id='theme-color-scheme-toggle'
-						class='toggle theme-controller'
+						class='toggle'
 						value='light'
 						disabled={themeSchemeMode() === 'device'}
 						checked={themeScheme() === 'light'}

diff --git a/www/src/screens/Editor.tsx b/www/src/screens/Editor.tsx
@@ -1,5 +1,5 @@
 import { useLocation } from '@solidjs/router';
-import { Suspense, lazy, onMount } from 'solid-js';
+import { Suspense, createEffect, lazy, on } from 'solid-js';
 import Header from '#component/Header.tsx';
 import GenericFallback from '#screen/GenericFallback.tsx';
 import { type LangKeys, langs, setLanguage } from '#util/langs.ts';
@@ -17,7 +17,11 @@ export default function EditorScreen() {
 		setLanguage(language as LangKeys);
 	}
 
-	onMount(() => document.documentElement.setAttribute('data-theme', themeScheme()));
+	createEffect(
+		on(themeScheme, (themeScheme) => {
+			document.documentElement.setAttribute('data-theme', themeScheme);
+		})
+	);
 
 	return (
 		/* FIXME: Overflows when width is over 1024px */