Adjust theme switch

This commit is contained in:
kritzl 2025-03-03 22:56:33 +01:00
commit a43ea460c3
Signed by: kritzl
SSH key fingerprint: SHA256:5BmINP9VjZWaUk5Z+2CTut1KFhwLtd0ZynMekKbtViM
8 changed files with 200 additions and 27 deletions

View file

@ -26,6 +26,17 @@ $showSidebar = true;
<!DOCTYPE html>
<html class="edge no-js" lang="<?php echo $conf['lang'] ?>" dir="<?php echo $lang['direction'] ?>">
<head>
<script>
const setTheme = (theme) => {
theme ??= localStorage.theme || "system";
document.getElementById("themeLight").checked = theme === "light";
document.getElementById("themeDark").checked = theme === "dark";
localStorage.theme = theme;
};
document.addEventListener("DOMContentLoaded", function () {
setTheme();
});
</script>
<?php
/* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + */
/* meta and link relations */
@ -406,6 +417,14 @@ $classWideContent = (Template::getInstance())->fullWidthClass();
<div class="no"><?php tpl_indexerWebBug() /* provide DokuWiki housekeeping, required in all templates */ ?></div>
<script src="https://eh22.easterhegg.eu/design/assets/script/styleguide.js" type="text/javascript"></script>
<script type="text/javascript">
document.querySelector("#themeDark").addEventListener("change", (e) => {
setTheme(e.target.checked ? "dark" : "system");
});
document.querySelector("#themeLight").addEventListener("change", (e) => {
setTheme(e.target.checked ? "light" : "system");
});
</script>
</body>
</html>