feat: theme switcher

internal/glance/templates/page.html

@@ -8,6 +8,11 @@
         slug: "{{ .Page.Slug }}",
         baseURL: "{{ .App.Config.Server.BaseURL }}",
     };
+
+    /**
+     * @type ThemeCollection
+     */
+    const userThemes = JSON.parse("{{ .Presets }}");
 </script>
 {{ end }}
 
@@ -29,6 +34,23 @@
 {{ end }}
 {{ end }}
 
+{{ define "theme-switcher" }}
+<div class="theme-dropdown">
+    <button class="dropdown-button">
+        <span>Theme</span>
+        <i class="arrow"></i>
+    </button>
+    <div class="dropdown-content">
+        <div class="theme-option" data-theme="default" data-scheme="dark">default</div>
+        <div class="theme-option" data-theme="light" data-scheme="light">light</div>
+        <div class="theme-option" data-theme="dark" data-scheme="dark">dark</div>
+        <div class="separator"></div>
+        <div class="custom-presets">
+        </div>
+    </div>
+</div>
+{{ end }}
+
 {{ define "document-body" }}
 <div class="flex flex-column body-content">
     {{ if not .Page.HideDesktopNavigation }}
@@ -39,6 +61,9 @@
             <div class="nav flex grow">
                 {{ template "navigation-links" . }}
             </div>
+            <div class="flex items-center">
+                {{ template "theme-switcher" . }}
+            </div>
         </div>
     </div>
     {{ end }}
@@ -52,7 +77,12 @@
             <label class="mobile-navigation-label"><input type="checkbox" class="mobile-navigation-page-links-input" autocomplete="on"{{ if .Page.ExpandMobilePageNavigation }} checked{{ end }}><div class="hamburger-icon"></div></label>
         </div>
         <div class="mobile-navigation-page-links">
-            {{ template "navigation-links" . }}
+            <div class="flex grow">
+                {{ template "navigation-links" . }}
+            </div>
+            <div class="flex items-center">
+                {{ template "theme-switcher" . }}
+            </div>
         </div>
     </div>