feat: create theme toggle with localStorage persistence

1 files changed, 30 insertions, 0 deletions

diff --git a/themes/danix-xyz-hacker/assets/js/theme-toggle.js b/themes/danix-xyz-hacker/assets/js/theme-toggle.js
new file mode 100644
index 0000000..97ed1ce
--- /dev/null
+++ b/themes/danix-xyz-hacker/assets/js/theme-toggle.js
@@ -0,0 +1,30 @@
+document.addEventListener('DOMContentLoaded', function() {
+  const themeToggle = document.getElementById('theme-toggle');
+
+  if (!themeToggle) {
+    return;
+  }
+
+  themeToggle.addEventListener('click', function(e) {
+    e.preventDefault();
+
+    // Get current theme from html element
+    const htmlElement = document.documentElement;
+    const isDark = htmlElement.classList.contains('theme-dark');
+    const newTheme = isDark ? 'light' : 'dark';
+
+    // Remove both theme classes
+    htmlElement.classList.remove('theme-light', 'theme-dark');
+
+    // Add the new theme class
+    htmlElement.classList.add(`theme-${newTheme}`);
+
+    // Persist to localStorage
+    localStorage.setItem('theme', newTheme);
+
+    // Update Feather Icons if available
+    if (window.feather) {
+      window.feather.replace();
+    }
+  });
+});