pages/assets/js/dark_mode.js
JD e30a46bbfa
Issue 105 : Dark Mode + Theming #118 (#119)
* 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.
2020-10-04 20:32:47 -04:00

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)
}
});