Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Themeing Option Fix #10

Open
alteredorange opened this issue Mar 3, 2020 · 1 comment
Open

Themeing Option Fix #10

alteredorange opened this issue Mar 3, 2020 · 1 comment

Comments

@alteredorange
Copy link

Awesome menu! Everything worked great except for themes, because local storage is never set, so it's always empty. If you check for local storage first, then set it to a default, it works like champ:

const themeMap = {
    dark: "light",
    light: "solar",
    solar: "dark"
};

if (localStorage.theme) {
    const theme = localStorage.getItem("theme");
    const bodyClass = document.body.classList;
    theme && bodyClass.add(theme);
    function toggleTheme() {
        const current = localStorage.getItem("theme");
        const next = themeMap[current];

        bodyClass.replace(current, next);
        localStorage.setItem("theme", next);
    }
} else {
    localStorage.setItem("theme", "light");
}

document.getElementById("themeButton").onclick = toggleTheme;

Thanks for the great videos!

@mohammadr09
Copy link

There is nothing wrong with the theme.js file. To use it, all you need to do is after the tag, create another tag, and link the theme.js file there.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants