revuo-weekly/js/main.js
DangerousFreedom 4c00b94a36 Add dark-theme
2022-03-30 17:21:26 +02:00

78 lines
2.2 KiB
JavaScript

var normal = document.getElementById("nav-menu");
var reverse = document.getElementById("nav-menu-left");
var icon = normal !== null ? normal : reverse;
const toggleSwitch = document.querySelector('.switch input[type="checkbox"]');
const currentTheme = localStorage.getItem('theme');
if (currentTheme) {
document.documentElement.setAttribute('data-theme', currentTheme);
if (currentTheme === 'dark') {
toggleSwitch.checked = true;
}
}
function switchTheme(e) {
if (e.target.checked) {
document.documentElement.setAttribute('data-theme', 'dark');
localStorage.setItem('theme', 'dark');
}
else { document.documentElement.setAttribute('data-theme', 'light');
localStorage.setItem('theme', 'light');
}
}
toggleSwitch.addEventListener('change', switchTheme, false);
//const currentTheme = localStorage.getItem("theme");
//const btn = document.querySelector("switch");
//const prefersDarkScheme = window.matchMedia("(prefers-color-scheme: dark)");
// Toggle the "menu-open" % "menu-opn-left" classes
function toggle() {
var navRight = document.getElementById("nav");
var navLeft = document.getElementById("nav-left");
var nav = navRight !== null ? navRight : navLeft;
var button = document.getElementById("menu");
var site = document.getElementById("wrap");
if (nav.className == "menu-open" || nav.className == "menu-open-left") {
nav.className = "";
button.className = "";
site.className = "";
} else if (reverse !== null) {
nav.className += "menu-open-left";
button.className += "btn-close";
site.className += "fixed";
} else {
nav.className += "menu-open";
button.className += "btn-close";
site.className += "fixed";
}
}
// Ensures backward compatibility with IE old versions
function menuClick() {
if (document.addEventListener && icon !== null) {
icon.addEventListener('click', toggle);
} else if (document.attachEvent && icon !== null) {
icon.attachEvent('onclick', toggle);
} else {
return;
}
}
//function toggledark(checkbox) {
//var elementb = document.body;
//var elementh = document.html;
//elementh.classList.toggle("dark-theme");
//elementb.classList.toggle("dark-theme");
//}
menuClick();