Toggle Darkmode w/ a body class
<a href='#' data-darkmode-btn>Toggle Darkmode</a> | |
<script type="text/javascript"> | |
/* eslint-disable */ | |
var darkModeBtn = document.querySelector('a[data-darkmode-btn]'); | |
var bodyEle = document.querySelector('body'); | |
if (localStorage.getItem('darkmode') === 'yes') { | |
bodyEle.classList.add("darkmode"); | |
} | |
function darkmodetoggle(e) { | |
e.preventDefault(); | |
var darkmode = localStorage.getItem('darkmode'); | |
if (darkmode === "yes") { | |
bodyEle.classList.remove("darkmode"); | |
localStorage.setItem('darkmode', 'no'); | |
} else { | |
bodyEle.classList.add("darkmode"); | |
localStorage.setItem('darkmode', 'yes'); | |
} | |
return; | |
} | |
darkModeBtn.addEventListener('click', darkmodetoggle); | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment