78 lines
2.2 KiB
JavaScript
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();
|