Initial AI theme draft

2026-07-26 16:56:32 +02:00
parent 56579bf158
commit 5542e72f98
16 changed files with 245 additions and 0 deletions
@@ -0,0 +1,56 @@
+(() => {
+	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));
+	});
+})();