Skip to content

Instantly share code, notes, and snippets.

@s10wen
Created June 19, 2019 14:53
Show Gist options
  • Save s10wen/2f988e655a541d7745f9f3a5b29dbedb to your computer and use it in GitHub Desktop.
Save s10wen/2f988e655a541d7745f9f3a5b29dbedb to your computer and use it in GitHub Desktop.
Local Storage - Dark Theme Site Switcher
// Set up the batman stylesheet link
const link = document.createElement('link');
link.href = '/css/batman.css';
link.rel = 'stylesheet';
const batmanHead = () => document.head.appendChild(link);
const batmanHeadRemove = () => document.head.removeChild(link);
const batmanLog = () => console.log(Array(16).join('hero'-1)+'Batman');
// If the theme is true, activate theme
if(localStorage.getItem('theme') === 'true') {
batmanHead();
batmanLog();
}
// Get the batman ID and if clicked,
document.getElementById('batman').addEventListener('click', function () {
// if the theme is true, switch to false and remove the stylesheet link
if(localStorage.getItem('theme') === 'true') {
localStorage.setItem('theme', 'false');
batmanHeadRemove();
} else {
localStorage.setItem('theme', 'true');
batmanHead();
batmanLog();
}
});
// On pressing 'b', activate theme.
window.onkeydown = function(event) {
if (event.keyCode == 66) {
batmanHead();
batmanLog();
localStorage.setItem('theme', 'true');
}
};
@damikas23
Copy link

where is the html?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment