This commit is contained in:
gribse 2025-10-06 19:21:06 +02:00
parent 2fe0c9a830
commit 7b9c07b83e
1444 changed files with 11476 additions and 42112 deletions

121
layouts/partials/header.html Executable file
View file

@ -0,0 +1,121 @@
{{- /* 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');
}
</script>
{{- /* theme is dark */}}
{{- else if (eq site.Params.defaultTheme "dark") }}
<script>
if (localStorage.getItem("pref-theme") === "light") {
document.body.classList.remove('dark')
}
</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 }}
{{- if (not site.Params.disableThemeToggle) }}
<script>
// Initialize all theme toggle buttons when the DOM is loaded
document.addEventListener('DOMContentLoaded', function() {
const themeToggles = document.querySelectorAll('.theme-toggle-button');
themeToggles.forEach(function(button) {
button.addEventListener('click', function() {
if (document.body.classList.contains('dark')) {
document.body.classList.remove('dark');
localStorage.setItem("pref-theme", "light");
} else {
document.body.classList.add('dark');
localStorage.setItem("pref-theme", "dark");
}
});
});
});
</script>
{{- end }}
<header class="header">
<nav class="nav">
<div class="logo">
{{- $label_text := (site.Params.label.text | default site.Title) }}
{{- if site.Title }}
<a href="{{ "" | absLangURL }}" accesskey="h" title="{{ $label_text }} (Alt + H)">
{{- if site.Params.label.icon }}
{{- $img := resources.Get site.Params.label.icon }}
{{- if $img }}
{{- $processableFormats := (slice "jpg" "jpeg" "png" "tif" "bmp" "gif") -}}
{{- if hugo.IsExtended -}}
{{- $processableFormats = $processableFormats | append "webp" -}}
{{- end -}}
{{- $prod := (hugo.IsProduction | or (eq site.Params.env "production")) }}
{{- if and (in $processableFormats $img.MediaType.SubType) (eq $prod true)}}
{{- if site.Params.label.iconHeight }}
{{- $img = $img.Resize (printf "x%d" site.Params.label.iconHeight) }}
{{ else }}
{{- $img = $img.Resize "x30" }}
{{- end }}
{{- end }}
<img src="{{ $img.Permalink }}" alt="" aria-label="logo"
height="{{- site.Params.label.iconHeight | default "30" -}}">
{{- else }}
<img src="{{- site.Params.label.icon | absURL -}}" alt="" aria-label="logo"
height="{{- site.Params.label.iconHeight | default "30" -}}">
{{- end -}}
{{- else if hasPrefix site.Params.label.iconSVG "<svg" }}
{{ site.Params.label.iconSVG | safeHTML }}
{{- end -}}
{{- $label_text -}}
<img src="/favicon.svg" alt="favicon" class="site-logo">
</a>
{{- end }}
</div>
{{- $currentPage := . }}
<!-- Desktop menu -->
<div class="menu-wrapper">
{{ partial "menu.html" }}
</div>
<!-- Hamburger Menu -->
<!-- Icon -->
<label for="menu-toggle" class="hamburger-menu" aria-label="Toggle menu">
<img src="/icons/hamburger-menu.svg" alt="Menu" width="24" height="24">
</label>
<!-- Hidden checkbox for toggling menu -->
<input type="checkbox" id="menu-toggle">
<!-- Menu overlay -->
<div class="menu-overlay">
<div class="mobile-menu">
<label for="menu-toggle" class="mobile-menu-close" aria-label="Close menu">
<img src="/icons/close-menu.svg" alt="Close Menu" width="24" height="24">
</label>
{{ partial "menu.html" }}
</div>
</div>
</nav>
</header>