Bento/assets/js/theme.js

48 lines
1.0 KiB
JavaScript
Raw Normal View History

2020-09-27 19:21:23 -05:00
// Store the theme
2021-01-09 23:56:22 -06:00
let darkTheme = localStorage.getItem("darkTheme");
const themeToggle = document.querySelector("#themeButton");
2020-08-29 22:47:08 -05:00
2021-01-09 23:56:22 -06:00
// Apply Dark theme
2020-08-30 01:08:03 -05:00
const enableDark = () => {
2021-01-09 23:56:22 -06:00
document.body.classList.add("darktheme");
localStorage.setItem("darkTheme", "enabled");
themeToggle.innerHTML = `<i id="themeButton__icon" data-feather="sun"></i>`;
2021-01-03 20:54:21 -06:00
feather.replace();
2020-08-30 01:32:40 -05:00
};
2021-01-09 23:56:22 -06:00
// Remove Dark theme
2020-08-30 01:32:40 -05:00
const disableDark = () => {
2021-01-09 23:56:22 -06:00
document.body.classList.remove("darktheme");
localStorage.setItem("darkTheme", null);
themeToggle.innerHTML = `<i id="themeButton__icon" data-feather="moon"></i>`;
2021-01-03 20:54:21 -06:00
feather.replace();
2020-08-30 01:32:40 -05:00
};
2021-01-09 23:56:22 -06:00
//Toggle theme
if (darkTheme === "enabled") {
2021-01-03 20:54:21 -06:00
enableDark();
2020-08-30 01:32:40 -05:00
} else {
2021-01-03 20:54:21 -06:00
disableDark();
2020-08-29 22:47:08 -05:00
}
2020-08-30 01:08:03 -05:00
2021-01-09 23:56:22 -06:00
themeToggle.addEventListener("click", () => {
darkTheme = localStorage.getItem("darkTheme");
if (darkTheme !== "enabled") {
2021-01-03 20:54:21 -06:00
enableDark();
} else {
disableDark();
}
2020-08-30 01:08:03 -05:00
});
2021-01-09 23:56:22 -06:00
// Theme accordint the hour
2020-10-16 20:28:24 -05:00
2021-01-09 23:56:22 -06:00
/*
const today = new Date();
if (hour >= 19 || hour < 5) {
enableDark();
} else {
disableDark();
2020-10-16 21:13:00 +06:00
}
*/