Update themes/mytheme/layouts/partials/header.html

This commit is contained in:
Morgan 2023-10-29 16:33:25 +09:00
parent 732568b090
commit 73e36ff38e
1 changed files with 59 additions and 48 deletions

View File

@ -1,51 +1,3 @@
{{- /* theme-toggle is enabled */}}
{{- if (not site.Params.disableThemeToggle) }}
{{- /* theme is light */}}
{{- if (eq site.Params.defaultTheme "light") }}
<script>
if (localStorage.getItem("pref-theme") === "dark") {
document.body.classList.add('dark');
{{- if site.Params.label.icon_inv }}
document.getElementById('main-logo').src = "{{site.Params.label.icon}}";
{{- end }}
}
</script>
{{- /* theme is dark */}}
{{- else if (eq site.Params.defaultTheme "dark") }}
<script>
if (localStorage.getItem("pref-theme") === "light") {
document.body.classList.remove('dark')
{{- if site.Params.label.icon_inv }}
document.getElementById('main-logo').src = "{{site.Params.label.icon_inv}}";
{{- end }}
}
</script>
{{- else }}
{{- /* theme is auto */}}
<script>
if (localStorage.getItem("pref-theme") === "dark") {
document.body.classList.add('dark');
} else if (localStorage.getItem("pref-theme") === "light") {
document.body.classList.remove('dark')
} else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.body.classList.add('dark');
}
</script>
{{- end }}
{{- /* theme-toggle is disabled and theme is auto */}}
{{- else if (and (ne site.Params.defaultTheme "light") (ne site.Params.defaultTheme "dark"))}}
<script>
if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.body.classList.add('dark');
}
</script>
{{- end }}
<header class="header">
<nav class="nav{{- if .IsHome }} nav-home{{- else if (not .IsPage) }} nav-nonpost{{- end }}">
<div class="logo">
@ -135,3 +87,62 @@
</ul>
</nav>
</header>
{{- /* theme-toggle is enabled */}}
{{- if (not site.Params.disableThemeToggle) }}
{{- /* theme is light */}}
{{- if (eq site.Params.defaultTheme "light") }}
<script>
if (localStorage.getItem("pref-theme") === "dark") {
document.body.classList.add('dark');
{{- if site.Params.label.icon_inv }}
document.getElementById('main-logo').src = "{{site.Params.label.icon}}";
{{- end }}
}
</script>
{{- /* theme is dark */}}
{{- else if (eq site.Params.defaultTheme "dark") }}
<script>
if (localStorage.getItem("pref-theme") === "light") {
document.body.classList.remove('dark')
{{- if site.Params.label.icon_inv }}
document.getElementById('main-logo').src = "{{site.Params.label.icon_inv}}";
{{- end }}
}
</script>
{{- else }}
{{- /* theme is auto */}}
<script>
if (localStorage.getItem("pref-theme") === "dark") {
document.body.classList.add('dark');
{{- if site.Params.label.icon_inv }}
document.getElementById('main-logo').src = "{{site.Params.label.icon}}";
{{- end }}
} else if (localStorage.getItem("pref-theme") === "light") {
document.body.classList.remove('dark')
{{- if site.Params.label.icon_inv }}
document.getElementById('main-logo').src = "{{site.Params.label.icon_inv}}";
{{- end }}
} else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.body.classList.add('dark');
{{- if site.Params.label.icon_inv }}
document.getElementById('main-logo').src = "{{site.Params.label.icon}}";
{{- end }}
}
</script>
{{- end }}
{{- /* theme-toggle is disabled and theme is auto */}}
{{- else if (and (ne site.Params.defaultTheme "light") (ne site.Params.defaultTheme "dark"))}}
<script>
if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.body.classList.add('dark');
{{- if site.Params.label.icon_inv }}
document.getElementById('main-logo').src = "{{site.Params.label.icon}}";
{{- end }}
}
</script>
{{- end }}