Adds color mode toggle and CSS theming.

This commit is contained in:
Michael Beck
2025-02-05 20:30:04 +01:00
parent 8852142535
commit 06af0fd666
4 changed files with 247 additions and 2 deletions

26
static/color_mode.js Normal file
View File

@@ -0,0 +1,26 @@
document.addEventListener('DOMContentLoaded', () => {
const themeToggle = document.getElementById('bd-theme');
// Check if a theme preference is saved in localStorage
const savedTheme = localStorage.getItem('theme');
if (savedTheme === 'dark') {
themeToggle.checked = true;
document.documentElement.setAttribute('data-bs-theme', 'dark');
} else {
themeToggle.checked = false;
document.documentElement.setAttribute('data-bs-theme', 'light');
}
// Add event listener to toggle theme on checkbox change
themeToggle.addEventListener('change', () => {
if (themeToggle.checked) {
document.documentElement.setAttribute('data-bs-theme', 'dark');
localStorage.setItem('theme', 'dark');
} else {
document.documentElement.setAttribute('data-bs-theme', 'light');
localStorage.setItem('theme', 'light');
}
});
});