feat: consolidate scripts into app.js

thunderpoot · Jul 4, 2024 · 44448e3 · 44448e3
1 parent 876f36f
commit 44448e3
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 18 deletions.
diff --git a/docs/app.js b/docs/app.js
@@ -165,4 +165,21 @@ function loadPage() {
     fetchLatestCommit();
 }
 
+const toggleButton = document.getElementById('dark-mode-toggle');
+const darkModeText = `<span class="dark-mode-button">Dark mode</span>`;
+const lightModeText = `<span class="dark-mode-button">Light mode</span>`;
+toggleButton.innerHTML = darkModeText;
+
+if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+    document.body.classList.add('dark-mode');
+    toggleButton.innerHTML = lightModeText;
+} else {
+    toggleButton.innerHTML = darkModeText;
+}
+
+toggleButton.addEventListener('click', () => {
+    document.body.classList.toggle('dark-mode');
+    toggleButton.innerHTML = document.body.classList.contains('dark-mode') ? lightModeText : darkModeText;
+});
+
 window.onload = loadPage;
diff --git a/docs/index.html b/docs/index.html
@@ -68,24 +68,6 @@
                 <span id="dark-mode-toggle" class="dark-mode-toggle">Dark mode</span>
             </div>
         </footer>
-        <script>
-            const toggleButton = document.getElementById('dark-mode-toggle');
-            const darkModeText = `<span class="dark-mode-button">Dark mode</span>`;
-            const lightModeText = `<span class="dark-mode-button">Light mode</span>`;
-            toggleButton.innerHTML = darkModeText;
-
-            if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
-                document.body.classList.add('dark-mode');
-                toggleButton.innerHTML = lightModeText;
-            } else {
-                toggleButton.innerHTML = darkModeText;
-            }
-
-            toggleButton.addEventListener('click', () => {
-                document.body.classList.toggle('dark-mode');
-                toggleButton.innerHTML = document.body.classList.contains('dark-mode') ? lightModeText : darkModeText;
-            });
-        </script>
     </div>
     <script src="app.js" defer></script>
 </body>