Fixed theme chooser not displayed upon first connection and some cleanup
This commit is contained in:
parent
9ab3804aec
commit
7ab6159c7f
3 changed files with 5 additions and 8 deletions
|
@ -1,5 +1,4 @@
|
||||||
.black-theme {
|
.black-theme {
|
||||||
/* Black mode */
|
|
||||||
--bg-0: #181818;
|
--bg-0: #181818;
|
||||||
--bg-1: #252525;
|
--bg-1: #252525;
|
||||||
--bg-2: #3b3b3b;
|
--bg-2: #3b3b3b;
|
||||||
|
@ -24,7 +23,6 @@
|
||||||
--br_violet: #b891f5;
|
--br_violet: #b891f5;
|
||||||
}
|
}
|
||||||
.dark-theme {
|
.dark-theme {
|
||||||
/* Dark mode */
|
|
||||||
--bg-0: #103c48;
|
--bg-0: #103c48;
|
||||||
--bg-1: #184956;
|
--bg-1: #184956;
|
||||||
--bg-2: #2d5b69;
|
--bg-2: #2d5b69;
|
||||||
|
@ -49,7 +47,6 @@
|
||||||
--br_violet: #bd96fa;
|
--br_violet: #bd96fa;
|
||||||
}
|
}
|
||||||
.light-theme {
|
.light-theme {
|
||||||
/* Light mode */
|
|
||||||
--bg-0: #fbf3db;
|
--bg-0: #fbf3db;
|
||||||
--bg-1: #ece3cc;
|
--bg-1: #ece3cc;
|
||||||
--bg-2: #d5cdb6;
|
--bg-2: #d5cdb6;
|
||||||
|
|
|
@ -14,12 +14,12 @@
|
||||||
{{- end -}}
|
{{- end -}}
|
||||||
{{- $url := urls.Parse .URL -}}
|
{{- $url := urls.Parse .URL -}}
|
||||||
{{- $baseurl := urls.Parse $.Site.Params.Baseurl -}}
|
{{- $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>
|
<a href="{{ with .Page }}{{ .RelPermalink }}{{ else }}{{ .URL | relLangURL }}{{ end }}"{{ if ne $url.Host $baseurl.Host }}target="_blank" {{ end }}>{{ .Name }}</a>
|
||||||
</li>
|
</li>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
<li>
|
<li>
|
||||||
<select id="themes" class="nav-menu-magin-left" onchange="setTheme()">
|
<select id="themes" onchange="setTheme()">
|
||||||
<option value="black-theme">Black</option>
|
<option value="black-theme">Black</option>
|
||||||
<option value="dark-theme">Dark</option>
|
<option value="dark-theme">Dark</option>
|
||||||
<option value="light-theme">Light</option>
|
<option value="light-theme">Light</option>
|
||||||
|
|
|
@ -1,15 +1,15 @@
|
||||||
<script>
|
<script>
|
||||||
function setTheme() {
|
function setTheme() {
|
||||||
const themeName = document.getElementById('themes').value;
|
const themeName = document.getElementById('themes').value;
|
||||||
localStorage.setItem('theme', themeName);
|
|
||||||
document.documentElement.className = themeName;
|
document.documentElement.className = themeName;
|
||||||
|
localStorage.setItem('theme', themeName);
|
||||||
}
|
}
|
||||||
(function () { // Set the theme on page load
|
(function () { // Set the theme on page load
|
||||||
|
const elt = document.getElementById('themes');
|
||||||
|
elt.style.display = 'block';
|
||||||
const themeName = localStorage.getItem('theme');
|
const themeName = localStorage.getItem('theme');
|
||||||
if (themeName) {
|
if (themeName) {
|
||||||
document.documentElement.className = themeName;
|
document.documentElement.className = themeName;
|
||||||
const elt = document.getElementById('themes');
|
|
||||||
elt.style.display = "block";
|
|
||||||
elt.value = themeName;
|
elt.value = themeName;
|
||||||
}
|
}
|
||||||
})();
|
})();
|
||||||
|
|
Loading…
Add table
Reference in a new issue