fixes

Kvarkas · Kvarkas · commit 60986dcaf401 · 2025-07-08T10:09:55.000+01:00
diff --git a/src/app.html b/src/app.html
@@ -4,9 +4,22 @@
 		<script>
 			(function() {
 				try {
+					// Check for stored theme
 					const storedTheme = localStorage.getItem('theme');
-					if (storedTheme) {
-						document.documentElement.setAttribute('data-theme', storedTheme);
+					const theme = storedTheme || (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
+					
+					// Set Bootstrap theme attribute
+					document.documentElement.setAttribute('data-bs-theme', theme);
+					
+					// If dark theme, inject Darkly CSS immediately to prevent flash
+					if (theme === 'dark') {
+						const darkThemeLink = document.createElement('link');
+						darkThemeLink.rel = 'stylesheet';
+						darkThemeLink.href = 'https://bootswatch.com/5/darkly/bootstrap.css';
+						darkThemeLink.integrity = 'sha384-mXM+8P9BUwTXMBS6pzZaBva0g/sZsdn7ZdBimWWpF/1K2kVhkyjQrBznOTf31ui7';
+						darkThemeLink.crossOrigin = 'anonymous';
+						darkThemeLink.setAttribute('data-theme', 'dark');
+						document.head.appendChild(darkThemeLink);
 					}
 				} catch (e) {
 					console.error('Could not apply theme from localStorage', e);
@@ -18,4 +31,4 @@
 	<body data-sveltekit-preload-data="hover">
 		<div style="display: contents">%sveltekit.body%</div>
 	</body>
-</html>
+</html>
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
@@ -33,6 +33,13 @@
 	<link rel="apple-touch-icon" sizes="180x180" href="{assets}/favicon/apple-touch-icon.png" />
 	<link rel="manifest" href="{assets}/favicon/site.webmanifest" />
 	
+	<!-- Bootstrap CSS -->
+	<link
+		rel="stylesheet"
+		href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
+		integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
+		crossorigin="anonymous" />
+
 	<!-- Bootswatch: Darkly theme -->
 	<link
 		rel="stylesheet"
