themetoggle.js

// Probably inefficent but who cares.
toggleDiv = document.getElementById("themeToggle");
lightDiv = document.getElementById("themeLight");
darkDiv = document.getElementById("themeDark");

//Check in storage
lightMode = localStorage.getItem("lightMode");
console.log("Light Mode is ", lightMode)
if (lightMode == null){
    localStorage.setItem("lightMode", true);
    lightMode = true;
}

changeTheme();


function changeTheme(){
    lightMode = localStorage.getItem("lightMode");
    if (lightMode == "true"){
        document.body.setAttribute("data-md-color-scheme", "default");
        lightDiv.classList.remove("darkIcon");
        darkDiv.classList.add("darkIcon");
    }
    else {
        document.body.setAttribute("data-md-color-scheme", "slate");
        lightDiv.classList.add("darkIcon");
        darkDiv.classList.remove("darkIcon");
    }
}

toggleDiv.onclick = function(){
    console.log("Current Theme is", lightMode)
    if (lightMode == "true"){
        lightMode = false;
    }
    else{
        lightMode = true;
    }
        

    localStorage.setItem("lightMode", lightMode);
    changeTheme();
}