testing dark/light mode

2026-08-13 12:21:37 -05:00
parent 1aad2224e2
commit d7d60dc0f6
5 changed files with 277 additions and 316 deletions
--- a/index.html
+++ b/index.html
@@ -3,16 +3,37 @@
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Hex Studios</title>
+
+    <script>
+        (function() {
+            var stored = localStorage.getItem('theme');
+            if (stored === 'light') document.documentElement.setAttribute('data-theme', 'light');
+        })();
+
+        function toggleTheme() {
+            var isLight = document.documentElement.getAttribute('data-theme') === 'light';
+            if (isLight) {
+                document.documentElement.removeAttribute('data-theme');
+                localStorage.setItem('theme', 'dark');
+            } else {
+                document.documentElement.setAttribute('data-theme', 'light');
+                localStorage.setItem('theme', 'light');
+            }
+        }
+    </script>
+
    <link rel="stylesheet" href="styles/main.css">
 </head>
 <body>
+    <button id="theme-toggle" onclick="toggleTheme()">toggle theme</button>
+
    <h1>// Hex Studios</h1>
    <i>Developer, biker, musician, engineer, and an unapologetic centrist in the deep red south. The real @hexstudios.</i>

    <div id="stick-posts-section">
        <h2>Pinned posts</h2>
        <ul>
-            <li><a href="posts/about.html">About Hex Studios</a></li>
+            <li><a href="posts/about.html">About</a></li>
        </ul>
    </div>