Задача этого чуда кода сохранять положение кнопки (что оно делает хорошо).
Менять тему (что оно тоже делает хорошо) и при этом сохранять последнюю выбранную тему (светлая и темная).
Проблема в том, что при перезапуске страницы кнопки остаются на своём положении как и должны, а вот тема отсутствует.
Исправляет всё это дело клацаньем несколько раз по чек боксу, но опять же тема сбрасывается на стандартную (белую).
Чек бокс с типом type="checkbox"
. Смена темы происходит благодаря :root[data-theme='dark']
document.querySelectorAll(".checkbox1").forEach(el => {
el.onchange = () => {
localStorage.setItem(el.id, el.checked)
if (document.documentElement.hasAttribute('data-theme')) {
document.documentElement.removeAttribute('data-theme')
localStorage.removeItem('theme')
} else {
document.documentElement.setAttribute('data-theme', 'dark')
localStorage.setItem('theme', 'dark')
}
}
})
document.querySelectorAll(".checkbox1").forEach(el => {
el.checked = localStorage.getItem(el.id) === "true";
})