fix: writing bit stuff cleaner

static/theme.ts

@@ -1,79 +1,41 @@
-type Theme = "light" | "dark";
+type Theme = 'light' | 'dark'
 
-const STORAGE_KEY = "theme";
+const STORAGE_KEY = 'theme'
 
 const getSavedTheme = (): Theme => {
-  const raw = localStorage.getItem(STORAGE_KEY);
-  if (raw === "light" || raw === "dark") return raw;
-  return "dark";
-};
+  const raw = localStorage.getItem(STORAGE_KEY)
+  if (raw === 'light' || raw === 'dark') {
+    return raw
+  }
+  return 'dark'
+}
 
 const applyTheme = (theme: Theme): void => {
-  const html = document.documentElement;
-  html.setAttribute("data-theme", theme);
-  localStorage.setItem(STORAGE_KEY, theme);
-  updateToggleButtons(theme);
-};
+  document.documentElement.setAttribute('data-theme', theme)
+  localStorage.setItem(STORAGE_KEY, theme)
+}
 
 const cycleTheme = (): void => {
-  const current = getSavedTheme();
-  const next: Theme = current === "light" ? "dark" : "light";
-  applyTheme(next);
-};
-
-const updateToggleButtons = (theme: Theme): void => {
-  const headerBtn = document.getElementById(
-    "theme-toggle",
-  ) as HTMLButtonElement | null;
-  const footerBtn = document.getElementById(
-    "footer-theme-toggle",
-  ) as HTMLButtonElement | null;
-
-  const updateButton = (btn: HTMLButtonElement | null): void => {
-    if (!btn) return;
-
-    const label = btn.querySelector("[data-theme-label]") as HTMLElement | null;
-    if (label) {
-      label.textContent = theme;
-    }
-
-    const svg = btn.querySelector("svg");
-    if (!svg) return;
-
-    if (theme === "light") {
-      svg.innerHTML =
-        '<circle cx="12" cy="12" r="5"/><path d="M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42"/>';
-      svg.setAttribute("stroke", "currentColor");
-      svg.setAttribute("fill", "none");
-    } else {
-      svg.innerHTML =
-        '<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/>';
-      svg.setAttribute("stroke", "currentColor");
-      svg.setAttribute("fill", "none");
-    }
-  };
-
-  updateButton(headerBtn);
-  updateButton(footerBtn);
-};
+  const current = getSavedTheme()
+  const next: Theme = current === 'light' ? 'dark' : 'light'
+  applyTheme(next)
+}
 
 const initTheme = (): void => {
-  const saved = getSavedTheme();
-  applyTheme(saved);
+  const saved = getSavedTheme()
+  applyTheme(saved)
 
-  // Use event delegation to handle theme toggles
-  document.addEventListener("click", (e) => {
-    const target = e.target as HTMLElement;
-    const btn = target.closest("#theme-toggle, #footer-theme-toggle") as HTMLButtonElement | null;
-    
+  document.addEventListener('click', (e) => {
+    const target = e.target as HTMLElement
+    const btn = target.closest('#theme-toggle, #footer-theme-toggle') as HTMLButtonElement | null
     if (btn) {
-      cycleTheme();
+      cycleTheme()
     }
-  });
-};
-
-if (document.readyState === "loading") {
-  document.addEventListener("DOMContentLoaded", initTheme);
-} else {
-  initTheme();
+  })
+}
+
+if (document.readyState === 'loading') {
+  document.addEventListener('DOMContentLoaded', initTheme)
+} else {
+  initTheme()
 }