37 lines
1.3 KiB
JavaScript
37 lines
1.3 KiB
JavaScript
function changeTheme(that) {
|
|
const themeName = that.getAttribute('themeName');
|
|
const previewImage = document.getElementById('previewImage');
|
|
const themeStatus = document.getElementById('themeStatus');
|
|
|
|
document.body.className = themeName;
|
|
|
|
that.parentElement.childNodes.forEach((child) => {
|
|
if (child.classList?.contains('theme-btn--active')) {
|
|
child.classList.remove('theme-btn--active');
|
|
}
|
|
});
|
|
that.classList.add('theme-btn--active');
|
|
|
|
let previewImgSrc = null;
|
|
switch (themeName) {
|
|
case 'dark-theme':
|
|
previewImage.src = 'assets/preview-dark.png';
|
|
themeStatus.textContent = 'Selected: Dark'
|
|
previewImgSrc = 'assets/preview-dark.png';
|
|
break;
|
|
case 'monet-dark-theme':
|
|
previewImage.src = 'assets/preview-monet-dark.png';
|
|
themeStatus.textContent = 'Selected: Monet Dark (Custom)'
|
|
previewImgSrc = 'assets/preview-monet-dark.png';
|
|
break;
|
|
default:
|
|
previewImage.src = 'assets/preview-light.png';
|
|
themeStatus.textContent = 'Selected: Light'
|
|
previewImgSrc = 'assets/preview-light.png';
|
|
}
|
|
|
|
const featImgs = document.getElementsByClassName('feat-img');
|
|
for (let featImg of featImgs) {
|
|
featImg.src = previewImgSrc;
|
|
}
|
|
} |