Removed toggle and forced dark mode; for now.

Author: abdonmorales

src/components/Footer.astro

@@ -1,13 +1,15 @@
 ---
 import Icon from './Icon.astro';
+import { version as astroVersion } from 'astro/package.json';
+
 const currentYear = new Date().getFullYear();
 const endCopyYear = new Date().getFullYear() + 2;
 ---
 
 <footer class="footer-shell glass-panel flush">
 	<div class="group">
 		<p>
-			Designed & Developed in Austin, Texas with <a href="https://astro.build/">Astro 5.14.1</a>
+			Designed & Developed in Austin, Texas with <a href="https://astro.build/">Astro v{astroVersion}</a>
 			<Icon icon="rocket-launch" size="1.2em" />
 		</p>
 		<p>&copy; {currentYear} - {endCopyYear} Abdon Morales.</p>

src/components/MainHead.astro

@@ -66,22 +66,9 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site ?? 'https://abdonmor
 	/>
 </noscript>
 <script is:inline>
-	// This code is inlined in the head to make dark mode instant & blocking.
-	const getThemePreference = () => {
-		if (typeof localStorage !== 'undefined' && localStorage.getItem('theme')) {
-			return localStorage.getItem('theme');
-		}
-		return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
-	};
-	const isDark = getThemePreference() === 'dark';
-	document.documentElement.classList[isDark ? 'add' : 'remove']('theme-dark');
-
-	if (typeof localStorage !== 'undefined') {
-		// Watch the document element and persist user preference when it changes.
-		const observer = new MutationObserver(() => {
-			const isDark = document.documentElement.classList.contains('theme-dark');
-			localStorage.setItem('theme', isDark ? 'dark' : 'light');
-		});
-		observer.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] });
-	}
+	// Force dark mode for now; toggle intentionally disabled.
+	document.documentElement.classList.add('theme-dark');
+	try {
+		localStorage.setItem('theme', 'dark');
+	} catch (_) {}
 </script>

src/components/Nav.astro

@@ -1,6 +1,5 @@
 ---
 import Icon from './Icon.astro';
-import ThemeToggle from './ThemeToggle';
 import type { iconPaths } from './IconPaths';
 
 /** Main menu items */
@@ -108,9 +107,9 @@ const iconLinks: { label: string; href: string; icon: keyof typeof iconPaths }[]
 					))
 				}
 			</div>
-			<div class="theme-toggle">
-				<ThemeToggle client:load />
-			</div>
+			{/*
+				TODO: Re-enable ThemeToggle after redesign; currently removed per request.
+			*/}
 		</div>
 	</div>
 </nav>

src/layouts/BaseLayout.astro

@@ -49,28 +49,11 @@ import {
 } from '../utilities/assetOptimization';
 import { createCompressionMonitor } from '../utilities/compressionMonitor';
 
-// Set up theme
-const savedTheme = localStorage.getItem('theme');
-const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
-const theme = savedTheme || (prefersDark ? 'dark' : 'light');
-if (theme === 'dark') {
-  document.documentElement.classList.add('theme-dark');
-} else {
-  document.documentElement.classList.remove('theme-dark');
-}
-
-// Set up theme change listener
-const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
-const handleChange = (e: MediaQueryListEvent) => {
-  if (!localStorage.getItem('theme')) {
-    if (e.matches) {
-      document.documentElement.classList.add('theme-dark');
-    } else {
-      document.documentElement.classList.remove('theme-dark');
-    }
-  }
-};
-mediaQuery.addEventListener('change', handleChange);
+// Force dark mode for now; re-enable dynamic toggle later.
+document.documentElement.classList.add('theme-dark');
+try {
+  localStorage.setItem('theme', 'dark');
+} catch (_) {}
 
 // Clean up and optimize loading
 if (document.readyState === 'loading') {