77 lines
2.0 KiB
JavaScript
77 lines
2.0 KiB
JavaScript
// Theme Management
|
|
class ThemeManager {
|
|
constructor() {
|
|
this.storageKey = 'pgadmin-theme';
|
|
this.darkClass = 'dark';
|
|
this.init();
|
|
}
|
|
|
|
init() {
|
|
const savedTheme = localStorage.getItem(this.storageKey);
|
|
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
const isDark = savedTheme ? savedTheme === 'dark' : prefersDark;
|
|
|
|
if (isDark) {
|
|
this.setDark();
|
|
} else {
|
|
this.setLight();
|
|
}
|
|
|
|
// Listen for system theme changes
|
|
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {
|
|
if (!localStorage.getItem(this.storageKey)) {
|
|
e.matches ? this.setDark() : this.setLight();
|
|
}
|
|
});
|
|
}
|
|
|
|
toggle() {
|
|
const html = document.documentElement;
|
|
if (html.classList.contains(this.darkClass)) {
|
|
this.setLight();
|
|
} else {
|
|
this.setDark();
|
|
}
|
|
}
|
|
|
|
setDark() {
|
|
document.documentElement.classList.add(this.darkClass);
|
|
localStorage.setItem(this.storageKey, 'dark');
|
|
this.updateIcons();
|
|
}
|
|
|
|
setLight() {
|
|
document.documentElement.classList.remove(this.darkClass);
|
|
localStorage.setItem(this.storageKey, 'light');
|
|
this.updateIcons();
|
|
}
|
|
|
|
isDark() {
|
|
return document.documentElement.classList.contains(this.darkClass);
|
|
}
|
|
|
|
updateIcons() {
|
|
// Update Lucide icons if needed
|
|
if (typeof lucide !== 'undefined') {
|
|
lucide.createIcons();
|
|
}
|
|
}
|
|
}
|
|
|
|
// Initialize theme manager
|
|
const themeManager = new ThemeManager();
|
|
|
|
// Theme toggle button handlers
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const themeButtons = [
|
|
document.getElementById('toggleTheme'),
|
|
document.getElementById('toggleAdminTheme')
|
|
];
|
|
|
|
themeButtons.forEach(btn => {
|
|
if (btn) {
|
|
btn.addEventListener('click', () => themeManager.toggle());
|
|
}
|
|
});
|
|
});
|