// 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()); } }); });