21 lines
930 B
JavaScript
21 lines
930 B
JavaScript
const container = document.querySelector('#colorBtnContainer');
|
|
const themeToggler = container.querySelector('.switch input');
|
|
const background = document.querySelector('aside > #gradient');
|
|
const btn = document.querySelector('#webRing > a:first-child > img');
|
|
|
|
export function themeSwitcher(){
|
|
container.style.visibility = 'visible';
|
|
console.log('selected btn:', btn);
|
|
themeToggler.addEventListener('change', (event) => {
|
|
if (event.target.checked){
|
|
document.documentElement.setAttribute('data-theme', 'light');
|
|
background.style.filter = 'invert(1) saturate(333%) brightness(93%) hue-rotate(90deg)';
|
|
btn.style.filter = 'invert(1) saturate(93%) brightness(233%) hue-rotate(90deg)';
|
|
}else{
|
|
document.documentElement.setAttribute('data-theme', 'dark');
|
|
background.style.filter = 'unset';
|
|
btn.style.filter = 'unset';
|
|
}
|
|
})
|
|
}
|