src/app.html

@@ -21,8 +21,7 @@
 				} else if (localStorage.theme && localStorage.theme === 'system') {
 					systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
 					document.documentElement.classList.add(systemTheme ? 'dark' : 'light');
-				}
+				} else {
-				else {
 					document.documentElement.classList.add('dark');
 				}
 

src/lib/components/chat/Settings/General.svelte

@@ -27,7 +27,7 @@
 
 	let showAdvanced = false;
 
-	function applyTheme(theme: string) { // only apply visually
+	function applyTheme(theme: string) {
 		let themeToApply = theme;
 		if (theme === 'system') {
 			themeToApply = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
@@ -45,7 +45,7 @@
 			document.documentElement.classList.add(e);
 		});
 
-		console.log(theme)
+		console.log(theme);
 	}
 
 	const toggleNotification = async () => {
@@ -135,7 +135,7 @@
 						class=" dark:bg-gray-900 w-fit pr-8 rounded py-2 px-2 text-xs bg-transparent outline-none text-right"
 						bind:value={selectedTheme}
 						placeholder="Select a theme"
-						on:change="{() => handleThemeChange(selectedTheme)}"
+						on:change={() => handleThemeChange(selectedTheme)}
 					>
 						<option value="system">⚙️ {$i18n.t('System')}</option>
 						<option value="dark">🌑 {$i18n.t('Dark')}</option>

src/lib/stores/index.ts

@@ -24,7 +24,7 @@ window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e)
 	});
 });
 
-export function setTheme(theme){
+export function setTheme(theme) {
 	rawThemeSetting.set(theme);
 	localStorage.setItem('theme', theme);
 }

src/routes/+layout.svelte

@@ -18,7 +18,7 @@
 	let loaded = false;
 
 	onMount(async () => {
-		setTheme(localStorage.theme)
+		setTheme(localStorage.theme);
 		// Check Backend Status
 		const backendConfig = await getBackendConfig();