Fixed theme chooser not displayed upon first connection and some cleanup

assets/base.css

@@ -1,5 +1,4 @@
 .black-theme {
-	/* Black mode */
 	--bg-0: #181818;
 	--bg-1: #252525;
 	--bg-2: #3b3b3b;
@@ -24,7 +23,6 @@
 	--br_violet: #b891f5;
 }
 .dark-theme {
-	/* Dark mode */
 	--bg-0: #103c48;
 	--bg-1: #184956;
 	--bg-2: #2d5b69;
@@ -49,7 +47,6 @@
 	--br_violet: #bd96fa;
 }
 .light-theme {
-	/* Light mode */
 	--bg-0: #fbf3db;
 	--bg-1: #ece3cc;
 	--bg-2: #d5cdb6;

layouts/partials/nav.html

@@ -14,12 +14,12 @@
 			{{- end -}}
 			{{- $url := urls.Parse .URL -}}
 			{{- $baseurl := urls.Parse $.Site.Params.Baseurl -}}
-			<li class="nav-menu-margins-left-and-right{{if $active }} nav-menu-active{{end}}">
+			<li{{if $active }} class="nav-menu-active"{{end}}>
 				<a href="{{ with .Page }}{{ .RelPermalink }}{{ else }}{{ .URL | relLangURL }}{{ end }}"{{ if ne $url.Host $baseurl.Host }}target="_blank" {{ end }}>{{ .Name }}</a>
 			</li>
 			{{ end }}
 			<li>
-				<select id="themes" class="nav-menu-magin-left" onchange="setTheme()">
+				<select id="themes" onchange="setTheme()">
 					<option value="black-theme">Black</option>
 					<option value="dark-theme">Dark</option>
 					<option value="light-theme">Light</option>

layouts/partials/themeSwitcher.html

@@ -1,15 +1,15 @@
 <script>
 	function setTheme() {
 		const themeName = document.getElementById('themes').value;
-		localStorage.setItem('theme', themeName);
 		document.documentElement.className = themeName;
+		localStorage.setItem('theme', themeName);
 	}
 	(function () {  // Set the theme on page load
+		const elt = document.getElementById('themes');
+		elt.style.display = 'block';
 		const themeName = localStorage.getItem('theme');
 		if (themeName) {
 			document.documentElement.className = themeName;
-			const elt = document.getElementById('themes');
-			elt.style.display = "block";
 			elt.value = themeName;
 		}
 	})();