80 lines
2.2 KiB
JavaScript
80 lines
2.2 KiB
JavaScript
/*!
|
|
* Start Bootstrap - Bare v5.0.9 (https://startbootstrap.com/template/bare)
|
|
* Copyright 2013-2023 Start Bootstrap
|
|
* Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-bare/blob/master/LICENSE)
|
|
*/
|
|
// Theme toggle logic for light/dark mode
|
|
(function () {
|
|
function onReady(callback) {
|
|
if (document.readyState !== 'loading') {
|
|
callback();
|
|
} else {
|
|
document.addEventListener('DOMContentLoaded', callback);
|
|
}
|
|
}
|
|
|
|
onReady(function () {
|
|
var storageKey = 'lasuca-theme';
|
|
var body = document.body;
|
|
|
|
if (!body || !body.classList) {
|
|
return;
|
|
}
|
|
|
|
var toggles = document.querySelectorAll('[data-theme-toggle]');
|
|
if (!toggles.length) {
|
|
return;
|
|
}
|
|
|
|
var storedTheme = null;
|
|
try {
|
|
storedTheme = window.localStorage.getItem(storageKey);
|
|
} catch (error) {
|
|
storedTheme = null;
|
|
}
|
|
|
|
var initialTheme = (storedTheme === 'light' || storedTheme === 'dark')
|
|
? storedTheme
|
|
: (body.classList.contains('theme-light') ? 'light' : 'dark');
|
|
|
|
applyTheme(initialTheme);
|
|
|
|
for (var i = 0; i < toggles.length; i += 1) {
|
|
toggles[i].addEventListener('click', function () {
|
|
var nextTheme = body.classList.contains('theme-dark') ? 'light' : 'dark';
|
|
applyTheme(nextTheme);
|
|
try {
|
|
window.localStorage.setItem(storageKey, nextTheme);
|
|
} catch (e) {
|
|
// Ignore storage errors (private browsing, etc.)
|
|
}
|
|
});
|
|
}
|
|
|
|
function applyTheme(theme) {
|
|
var activeTheme = theme === 'light' ? 'light' : 'dark';
|
|
body.classList.remove('theme-dark', 'theme-light');
|
|
body.classList.add('theme-' + activeTheme);
|
|
|
|
for (var j = 0; j < toggles.length; j += 1) {
|
|
var button = toggles[j];
|
|
var labelText = activeTheme === 'light' ? 'Dark Mode' : 'Light Mode';
|
|
var iconText = activeTheme === 'light' ? '🌙' : '🌞';
|
|
|
|
button.setAttribute('aria-label', 'Switch to ' + labelText.toLowerCase());
|
|
button.setAttribute('title', 'Switch to ' + labelText.toLowerCase());
|
|
button.setAttribute('data-theme-current', activeTheme);
|
|
|
|
var labelNode = button.querySelector('[data-theme-toggle-label]');
|
|
if (labelNode) {
|
|
labelNode.textContent = labelText;
|
|
}
|
|
|
|
var iconNode = button.querySelector('[data-theme-toggle-icon]');
|
|
if (iconNode) {
|
|
iconNode.textContent = iconText;
|
|
}
|
|
}
|
|
}
|
|
});
|
|
})(); |