57 lines
2.0 KiB
JavaScript
57 lines
2.0 KiB
JavaScript
(() => {
|
|
const root = document.documentElement;
|
|
const storedTheme = localStorage.getItem('c1024-theme');
|
|
if (storedTheme) root.dataset.theme = storedTheme;
|
|
|
|
const themeToggle = document.querySelector('[data-theme-toggle]');
|
|
if (themeToggle) {
|
|
const updateThemeLabel = () => {
|
|
const dark = root.dataset.theme === 'dark';
|
|
themeToggle.setAttribute('aria-pressed', String(dark));
|
|
themeToggle.setAttribute('aria-label', dark ? 'Use light mode' : 'Use dark mode');
|
|
};
|
|
updateThemeLabel();
|
|
themeToggle.addEventListener('click', () => {
|
|
root.dataset.theme = root.dataset.theme === 'dark' ? 'light' : 'dark';
|
|
localStorage.setItem('c1024-theme', root.dataset.theme);
|
|
updateThemeLabel();
|
|
});
|
|
}
|
|
|
|
const header = document.querySelector('.site-header');
|
|
let lastY = window.scrollY;
|
|
let ticking = false;
|
|
window.addEventListener('scroll', () => {
|
|
if (ticking || !header) return;
|
|
ticking = true;
|
|
requestAnimationFrame(() => {
|
|
const currentY = window.scrollY;
|
|
header.classList.toggle('is-hidden', currentY > lastY && currentY > header.offsetHeight);
|
|
lastY = currentY;
|
|
ticking = false;
|
|
});
|
|
}, { passive: true });
|
|
|
|
const searchToggle = document.querySelector('[data-search-toggle]');
|
|
const searchPanel = document.querySelector('[data-search-panel]');
|
|
if (searchToggle && searchPanel) {
|
|
searchToggle.addEventListener('click', () => {
|
|
const open = searchPanel.classList.toggle('is-open');
|
|
searchToggle.setAttribute('aria-expanded', String(open));
|
|
if (open) searchPanel.querySelector('input')?.focus();
|
|
});
|
|
document.addEventListener('click', event => {
|
|
if (!searchPanel.contains(event.target) && !searchToggle.contains(event.target)) {
|
|
searchPanel.classList.remove('is-open');
|
|
searchToggle.setAttribute('aria-expanded', 'false');
|
|
}
|
|
});
|
|
}
|
|
|
|
const menuToggle = document.querySelector('[data-menu-toggle]');
|
|
if (menuToggle && header) menuToggle.addEventListener('click', () => {
|
|
const open = header.classList.toggle('menu-open');
|
|
menuToggle.setAttribute('aria-expanded', String(open));
|
|
});
|
|
})();
|