49 lines
1.6 KiB
JavaScript
49 lines
1.6 KiB
JavaScript
// Copyright © 2026 Olaf Kolkman
|
|
// SPDX-License-Identifier: GPL-3.0-or-later
|
|
|
|
const themePreference = 'linklog-theme';
|
|
|
|
async function loadAvailableThemes() {
|
|
const response = await fetch('/api/public/themes');
|
|
if (!response.ok) return;
|
|
const themes = await response.json();
|
|
const selected = themes.some((theme) => theme.id === localStorage.getItem(themePreference))
|
|
? localStorage.getItem(themePreference)
|
|
: themes[0]?.id;
|
|
if (selected) document.documentElement.dataset.theme = selected;
|
|
|
|
const submenuContainer = document.querySelector('#theme-submenu-container');
|
|
const themeOptions = document.querySelector('#theme-options');
|
|
const submenuTitle = document.querySelector('.submenu-title');
|
|
|
|
if (!submenuContainer || !themeOptions || !themes.length) return;
|
|
|
|
// Show the submenu container
|
|
submenuContainer.classList.remove('hidden');
|
|
|
|
// Create theme buttons
|
|
const buttons = themes.map((theme) => {
|
|
const button = document.createElement('button');
|
|
button.type = 'button';
|
|
button.className = 'theme-option';
|
|
button.dataset.themeId = theme.id;
|
|
button.textContent = theme.label;
|
|
if (theme.id === selected) {
|
|
button.classList.add('active');
|
|
}
|
|
button.addEventListener('click', () => {
|
|
localStorage.setItem(themePreference, theme.id);
|
|
document.documentElement.dataset.theme = theme.id;
|
|
// Update active state
|
|
document.querySelectorAll('.theme-option').forEach((btn) => {
|
|
btn.classList.remove('active');
|
|
});
|
|
button.classList.add('active');
|
|
});
|
|
return button;
|
|
});
|
|
|
|
themeOptions.replaceChildren(...buttons);
|
|
}
|
|
|
|
loadAvailableThemes(); |