Adjust theme switch
This commit is contained in:
parent
0501598d41
commit
a43ea460c3
8 changed files with 200 additions and 27 deletions
21
main.php
21
main.php
|
@ -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>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue