From 4c41e477e13d37e187c8de4225c7e8056bd9ed28 Mon Sep 17 00:00:00 2001
From: Martin Kagamino Lehoux <martin@lehoux.net>
Date: Mon, 29 Sep 2025 19:17:13 +0200
Subject: Internalise theme

---
 layouts/partials/header/theme-button.html | 47 +++++++++++++++++++++++++++++++
 1 file changed, 47 insertions(+)
 create mode 100644 layouts/partials/header/theme-button.html

(limited to 'layouts/partials/header/theme-button.html')

diff --git a/layouts/partials/header/theme-button.html b/layouts/partials/header/theme-button.html
new file mode 100644
index 0000000..0a8313b
--- /dev/null
+++ b/layouts/partials/header/theme-button.html
@@ -0,0 +1,47 @@
+<button class="toggle-theme" aria-label="Toggle Theme" title="Toggle Theme" onclick="toggleTheme()">
+  <span class="theme-icon light"> {{ partial "utils/icon" "sun" }} </span>
+  <span class="theme-icon dark"> {{ partial "utils/icon" "moon" }} </span>
+</button>
+
+<script>
+  document.addEventListener('DOMContentLoaded', function () {
+    const theme = localStorage.getItem('theme');
+
+    if (!theme || theme === 'light') {
+      setTheme('light');
+    } else {
+      setTheme(theme);
+    }
+  });
+
+  function setTheme(theme) {
+    const html = document.querySelector('html');
+    localStorage.setItem('theme', theme);
+
+    if (theme === 'light') {
+      if (html.classList.contains('dark')) {
+        document.querySelector('html').classList.remove('dark');
+      }
+
+      document.querySelector('.theme-icon.light').style.display = 'none';
+      document.querySelector('.theme-icon.dark').style.display = 'block';
+    } else {
+      if (!html.classList.contains('dark')) {
+        document.querySelector('html').classList.add('dark');
+      }
+
+      document.querySelector('.theme-icon.dark').style.display = 'none';
+      document.querySelector('.theme-icon.light').style.display = 'block';
+    }
+  }
+
+  function toggleTheme() {
+    const theme = localStorage.getItem('theme');
+
+    if (theme === 'light') {
+      setTheme('dark');
+    } else {
+      setTheme('light');
+    }
+  }
+</script>
\ No newline at end of file
-- 
cgit v1.3