From 627f1f5d32ebeb89c41f72d960b4ab35778f7625 Mon Sep 17 00:00:00 2001
From: Julien Dessaux
Date: Wed, 25 Jan 2023 17:45:06 +0100
Subject: Added themes

---
 layouts/partials/nav.html           |  7 +++++++
 layouts/partials/themeSwitcher.html | 14 ++++++++++++++
 2 files changed, 21 insertions(+)
 create mode 100644 layouts/partials/themeSwitcher.html

(limited to 'layouts/partials')

diff --git a/layouts/partials/nav.html b/layouts/partials/nav.html
index 1020c03..5abfc6f 100644
--- a/layouts/partials/nav.html
+++ b/layouts/partials/nav.html
@@ -2,6 +2,13 @@
 	<nav>
 		<ul>
 			<li class="nav-menu-title{{if .IsHome}} nav-menu-active{{end}}"><a href="/">{{ .Site.Title }}</a></li>
+			<li>
+				<select id="themes" class="nav-menu-magin-left" onchange="setTheme()">
+					<option value="black-theme">Black</option>
+					<option value="dark-theme">Dark</option>
+					<option value="light-theme">Light</option>
+				</select>
+			</li>
 			{{- $p := . -}}
 
 			{{- range first 1 .Site.Menus.main.ByWeight -}}
diff --git a/layouts/partials/themeSwitcher.html b/layouts/partials/themeSwitcher.html
new file mode 100644
index 0000000..685bd82
--- /dev/null
+++ b/layouts/partials/themeSwitcher.html
@@ -0,0 +1,14 @@
+<script>
+	function setTheme() {
+		const themeName = document.getElementById('themes').value;
+		localStorage.setItem('theme', themeName);
+		document.documentElement.className = themeName;
+	}
+	(function () {  // Set the theme on page load
+		const themeName = localStorage.getItem('theme');
+		if (themeName) {
+			document.documentElement.className = themeName;
+			document.getElementById('themes').value = themeName;
+		}
+	})();
+</script>
-- 
cgit v1.2.3