26 lines
1.0 KiB
JavaScript
26 lines
1.0 KiB
JavaScript
// ── Theme picker ──
|
|
|
|
import { $ } from './util.js';
|
|
|
|
const picker = $('theme-picker');
|
|
const list = $('theme-list');
|
|
|
|
if (list) {
|
|
for (const [key, t] of Object.entries(window.themes)) {
|
|
const btn = document.createElement('button');
|
|
btn.className = 'flex items-center gap-2.5 w-full px-2 py-1.5 text-left text-xs text-t-muted hover:text-t-bright transition-colors rounded';
|
|
btn.dataset.themeDot = key;
|
|
btn.innerHTML = `<span class="w-3 h-3 rounded-full shrink-0 border border-t-border" style="background:${t.vars['--t-accent']}"></span>
|
|
<span class="font-pixel text-[10px]">${t.label}</span>`;
|
|
btn.onclick = () => { window.applyTheme(key); window._renderBoard?.(); };
|
|
list.appendChild(btn);
|
|
}
|
|
}
|
|
|
|
window.applyTheme(localStorage.getItem('hyprcrd-theme') || 'slate');
|
|
|
|
if (picker) {
|
|
$('theme-toggle')?.addEventListener('click', () => picker.classList.toggle('open'));
|
|
document.addEventListener('click', e => { if (!picker.contains(e.target)) picker.classList.remove('open'); });
|
|
}
|