* Dark Mode + Theming * Themes scss file created with default color scheme and dark color scheme. * Logic for managing dark mode toggle added. * Modified existing scss/html to work with theme toggling. * Fixed hover issues * Added enable_darkmode to configs. * Added the requested option of disabling/enabling dark mode via config files.
35 lines
959 B
JavaScript
35 lines
959 B
JavaScript
$(document).ready(function() {
|
|
const mode_toggle = document.getElementById("light-toggle");
|
|
|
|
mode_toggle.addEventListener("click", function() {
|
|
const temp = localStorage.getItem('theme');
|
|
toggleTheme(temp);
|
|
});
|
|
|
|
let toggleTheme = (theme) => {
|
|
if (theme == "dark") {
|
|
setTheme(null);
|
|
} else {
|
|
setTheme('dark');
|
|
}
|
|
}
|
|
|
|
let setTheme = (theme) => {
|
|
trans();
|
|
if (theme) {
|
|
document.documentElement.setAttribute('data-theme', theme)
|
|
}
|
|
else {
|
|
document.documentElement.removeAttribute('data-theme');
|
|
}
|
|
localStorage.setItem('theme', theme);
|
|
};
|
|
|
|
let trans = () => {
|
|
document.documentElement.classList.add('transition');
|
|
window.setTimeout(() => {
|
|
document.documentElement.classList.remove('transition')
|
|
}, 1000)
|
|
}
|
|
});
|
|
|