Created
March 4, 2020 08:06
-
-
Save wireinet/30778f8504da46de631465799b5507ee to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict'; | |
// создаем <link rel="stylesheet" href="light|dark.css"> | |
let head = document.head, | |
link = document.createElement('link'); | |
link.rel = 'stylesheet'; | |
// проверяем значение из localStorage если dark то темная тема | |
if (localStorage.getItem('themeStyle') === 'dark') { | |
link.href = 'dark.css'; // ссылка на темный стиль | |
document.getElementById('switch-1').setAttribute('checked', true); // переключаем чекбокс в положение "темная тема" | |
} | |
// по умолчанию светлая тема | |
else { | |
link.href = 'light.css'; // ссылка на светлый стиль | |
} | |
head.appendChild(link); // вставляем <link rel="stylesheet" href="light|dark.css"> в шапку страницы между темаги head | |
// событие при переключении чекбокса | |
document.getElementById('switch-1').addEventListener('change', ev => { | |
let btn = ev.target; | |
// если чекбокс включен | |
if (btn.checked) { | |
link.href = 'dark.css'; // сключаем темную тему | |
localStorage.setItem('themeStyle', 'dark'); // записываем значение в localStorage | |
} | |
else { | |
link.href = 'light.css'; // включаем светлую тему | |
localStorage.setItem('themeStyle', 'light'); // записываем значение в localStorage | |
} | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment