From b9e6bcd653a06977e088b4f9551b87735977485c Mon Sep 17 00:00:00 2001
From: thiloho <123883702+thiloho@users.noreply.github.com>
Date: Fri, 9 May 2025 12:30:49 +0200
Subject: [PATCH] Move themeToggle script into layout

---
 src/components/Head.astro    |  1 -
 src/components/Nav.astro     | 17 -----------------
 src/layouts/PageLayout.astro | 17 +++++++++++++++++
 3 files changed, 17 insertions(+), 18 deletions(-)

diff --git a/src/components/Head.astro b/src/components/Head.astro
index 2a4876f..b6469c3 100644
--- a/src/components/Head.astro
+++ b/src/components/Head.astro
@@ -55,7 +55,6 @@ const { title, description } = Astro.props;
     };
 
     setTheme();
-
     document.addEventListener("astro:after-swap", setTheme);
   </script>
 </head>
diff --git a/src/components/Nav.astro b/src/components/Nav.astro
index c42c1f1..ec63a67 100644
--- a/src/components/Nav.astro
+++ b/src/components/Nav.astro
@@ -34,20 +34,3 @@ const routes = ["blog", "tracks"];
     </div>
   </div>
 </nav>
-
-<script>
-  const setToggleListener = () => {
-    const toggleBtn = document.querySelector("#theme-toggle");
-
-    toggleBtn?.addEventListener("click", () => {
-      const element = document.documentElement;
-      element.classList.toggle("dark");
-
-      const isDark = element.classList.contains("dark");
-      localStorage.setItem("theme", isDark ? "dark" : "light");
-    });
-  };
-
-  setToggleListener();
-  document.addEventListener("astro:after-swap", setToggleListener);
-</script>
diff --git a/src/layouts/PageLayout.astro b/src/layouts/PageLayout.astro
index fcc501f..697e857 100644
--- a/src/layouts/PageLayout.astro
+++ b/src/layouts/PageLayout.astro
@@ -30,3 +30,20 @@ const { title, description, pubDate, modDate, slug } = Astro.props;
     <Footer />
   </body>
 </html>
+
+<script>
+  const setToggleListener = () => {
+    const toggleBtn = document.querySelector("#theme-toggle");
+
+    toggleBtn?.addEventListener("click", () => {
+      const element = document.documentElement;
+      element.classList.toggle("dark");
+
+      const isDark = element.classList.contains("dark");
+      localStorage.setItem("theme", isDark ? "dark" : "light");
+    });
+  };
+
+  setToggleListener();
+  document.addEventListener("astro:after-swap", setToggleListener);
+</script>