<!DOCTYPE html>
<html data-theme="light" lang="{{ .Site.Language }}" itemscope itemtype="http://schema.org/WebPage">
<head>
{{ partial "head.html" . }}
</head>
<body class="d-flex flex-column min-vh-100">
<svg id="fader" class="fade-out"></svg>
<script>fadeInPage()</script>
<a class="screen-reader-text" href="#content">{{ i18n "skipLink" }}</a>
<button aria-label="{{ i18n "toggle" }}" id="theme-toggle" data-bs-toggle="tooltip" data-bs-placement="right" data-bs-title="{{ i18n "toggle" }}"
class="acctoggle">{{ partial "fontawesome.html" "solid/circle-half-stroke" }}</button>
<script>
let theme = localStorage.getItem("data-theme");
const themeToggle = document.querySelector("#theme-toggle");
const changeThemeToDark = () => {
document.documentElement.setAttribute("data-theme", "dark");
localStorage.setItem("data-theme", "dark");
};
const changeThemeToLight = () => {
document.documentElement.setAttribute("data-theme", "light");
localStorage.setItem("data-theme", "light");
};
if (theme === "dark") {
changeThemeToDark();
}
themeToggle.addEventListener("click", () => {
let theme = localStorage.getItem("data-theme");
if (theme === "dark") {
changeThemeToLight();
} else {
changeThemeToDark();
}
});
</script>
{{ partial "header.html" . }}
<div id="content" class="content">
{{ block "main" . }}{{ end }}
</div>
{{ block "footer" . }}
{{ partial "footer.html" . }}
{{ end }}
<script>
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
</script>
</body>
</html>