diff mrjunejune/pages/index.js @ 80:d55157451947

[MrJuneJune] Updating my homepage.
author June Park <parkjune1995@gmail.com>
date Thu, 01 Jan 2026 08:23:46 -0800
parents 35b1abc37969
children 1ded13720541
line wrap: on
line diff
--- a/mrjunejune/pages/index.js	Thu Jan 01 05:57:03 2026 -0800
+++ b/mrjunejune/pages/index.js	Thu Jan 01 08:23:46 2026 -0800
@@ -14,49 +14,37 @@
   const root = document.documentElement;
 
   if (preference === 'light') {
+    root.classList.remove('dark', 'auto');
     root.classList.add('light-mode');
-    root.classList.remove('dark');
   } else if (preference === 'dark') {
-    root.classList.remove('light-mode');
+    root.classList.remove('light-mode', 'auto');
     root.classList.add('dark');
   } else {
     // Auto - remove manual overrides and let CSS media query handle it
     root.classList.remove('light-mode', 'dark');
+    root.classList.add('auto');
   }
 }
 
-function populateHeader()
-{
-  fetch("/parts/headers.html")
-    .then(res => res.text())
-    .then(headerHTML => {
-      const range = document.createRange();
-      const fragment = range.createContextualFragment(headerHTML);
-      header.appendChild(fragment);
-      
-      const toggle = document.querySelector('#themeToggle');
-      if (!toggle) return;
-
-      toggle.addEventListener('click', function() {
-        let preference = getThemePreference();
-
-        // Cycle through: auto -> light -> dark -> auto
-        if (preference === 'auto') {
-          preference = 'light';
-        } else if (preference === 'light') {
-          preference = 'dark';
-        } else {
-          preference = 'auto';
-        }
-
-        localStorage.setItem(STORAGE_KEY, preference);
-        applyTheme(preference);
-      });
-    });
-}
-populateHeader();
-
 (function() {
   const currentPreference = getThemePreference();
   applyTheme(currentPreference);
 })();
+
+/* Toggle lights auto and dark */
+const toggle = document.querySelector('#themeToggle');
+toggle.addEventListener('click', function() {
+  let preference = getThemePreference();
+
+  // Cycle through: auto -> light -> dark -> auto
+  if (preference === 'auto') {
+    preference = 'light';
+  } else if (preference === 'light') {
+    preference = 'dark';
+  } else {
+    preference = 'auto';
+  }
+
+  localStorage.setItem(STORAGE_KEY, preference);
+  applyTheme(preference);
+});