feat: Theme toggle with localStorage persistence
This commit is contained in:
+41
-2
@@ -1,7 +1,46 @@
|
|||||||
// === Scratching Post Admin JS ===
|
// === Scratching Post Admin JS ===
|
||||||
|
|
||||||
|
// === Theme Toggle ===
|
||||||
|
(function () {
|
||||||
|
var saved = localStorage.getItem('sb-theme') || 'dark';
|
||||||
|
document.documentElement.setAttribute('data-theme', saved);
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
|
updateToggleIcon(saved);
|
||||||
|
|
||||||
|
var btn = document.getElementById('themeToggle');
|
||||||
|
if (btn) {
|
||||||
|
btn.addEventListener('click', function () {
|
||||||
|
var current = document.documentElement.getAttribute('data-theme') || 'dark';
|
||||||
|
var next = current === 'dark' ? 'light' : 'dark';
|
||||||
|
document.documentElement.setAttribute('data-theme', next);
|
||||||
|
localStorage.setItem('sb-theme', next);
|
||||||
|
updateToggleIcon(next);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function updateToggleIcon(theme) {
|
||||||
|
var btn = document.getElementById('themeToggle');
|
||||||
|
if (!btn) return;
|
||||||
|
btn.innerHTML = theme === 'dark'
|
||||||
|
? '<i class="bi bi-sun"></i>'
|
||||||
|
: '<i class="bi bi-moon-stars"></i>';
|
||||||
|
btn.title = theme === 'dark' ? 'Switch to Light Mode' : 'Switch to Dark Mode';
|
||||||
|
}
|
||||||
|
})();
|
||||||
|
|
||||||
|
// Auto-dismiss alerts after 5 seconds
|
||||||
document.querySelectorAll('.alert-dismissible').forEach(function (alert) {
|
document.querySelectorAll('.alert-dismissible').forEach(function (alert) {
|
||||||
setTimeout(function () { var bsAlert = bootstrap.Alert.getOrCreateInstance(alert); bsAlert.close(); }, 5000);
|
setTimeout(function () {
|
||||||
|
var bsAlert = bootstrap.Alert.getOrCreateInstance(alert);
|
||||||
|
bsAlert.close();
|
||||||
|
}, 5000);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Confirm dangerous actions
|
||||||
document.querySelectorAll('[data-confirm]').forEach(function (el) {
|
document.querySelectorAll('[data-confirm]').forEach(function (el) {
|
||||||
el.addEventListener('click', function (e) { if (!confirm(this.dataset.confirm)) e.preventDefault(); });
|
el.addEventListener('click', function (e) {
|
||||||
|
if (!confirm(this.dataset.confirm)) e.preventDefault();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user