Why the default theme as a value? shouldn't that be a normal thing to happen?
🗣️discussion👀ui/ux
front-end
front-endI keep seeing this trend growing more and more, where in a website suddenly there are 3 VALUES for the theme picker (be it a select, icons to click, ...) instead of 2, and suddenly this default value could be chosen, but I tend to think that that's unnecessary, after all for example say in the
/* ===== Load theme on page load ===== */
let mode = localStorage.getItem("website-mode");
const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)").matches;
// true means browser has dark mode
// false means lightmode
if (mode === "dark") {
document.documentElement.classList.add("dark-mode");
} else if (mode === "light" ) {
document.documentElement.classList.add("light-mode");
} else if (mediaQuery === true) {
document.documentElement.classList.add("dark-mode");
} else {
document.documentElement.classList.add("light-mode");
}
// a better implementation maybe exists to this code but it shows the purpose of question and is functional
which indeed responds to the user media preference if he didn't use the toggler before, so that's way I fail to see the purpose of default theme value, where in fact we can set up that for the user, or am I missing a point or points here? THANKS to all of your feedbacks
theme.js/* ===== Load theme on page load ===== */
let mode = localStorage.getItem("website-mode");
const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)").matches;
// true means browser has dark mode
// false means lightmode
if (mode === "dark") {
document.documentElement.classList.add("dark-mode");
} else if (mode === "light" ) {
document.documentElement.classList.add("light-mode");
} else if (mediaQuery === true) {
document.documentElement.classList.add("dark-mode");
} else {
document.documentElement.classList.add("light-mode");
}
// a better implementation maybe exists to this code but it shows the purpose of question and is functional
which indeed responds to the user media preference if he didn't use the toggler before, so that's way I fail to see the purpose of default theme value, where in fact we can set up that for the user, or am I missing a point or points here? THANKS to all of your feedbacks
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263Members
Resources
Similar Threads
Was this page helpful?
