https://useful-forks.github.io/src/theme.js

1/* Theme toggle – Fix #34 – light/dark toggle, default light, choice kept in localStorage */
2const LOCAL_STORAGE_THEME = "useful-forks-theme";
3
4function applyTheme(theme) {
5  const t = theme === 'dark' ? 'dark' : 'light';
6  const html = document.documentElement;
7  const body = document.body;
8  html.setAttribute('data-theme', t);
9  if (body) {
10    body.setAttribute('data-theme', t);
11    body.classList.toggle('dark', t === 'dark');
12  }
13  const btn = document.getElementById('themeToggleBtn');
14  if (btn) {
15    const other = t === 'dark' ? 'light' : 'dark';
16    btn.textContent = t === 'dark' ? '☀️ Light' : '🌙 Dark';
17    btn.setAttribute('aria-label', `Switch to ${other} theme`);
18    btn.setAttribute('title', `Switch to ${other} theme`);
19  }
20}
21
22function getStoredTheme() {
23  try {
24    return localStorage.getItem(LOCAL_STORAGE_THEME) === 'dark' ? 'dark' : 'light';
25  } catch (e) {
26    return 'light';
27  }
28}
29
30function setStoredTheme(t) {
31  try { localStorage.setItem(LOCAL_STORAGE_THEME, t); } catch (e) {}
32  applyTheme(t);
33}
34
35function toggleTheme() {
36  setStoredTheme(getStoredTheme() === 'dark' ? 'light' : 'dark');
37}
38
39function initTheme() {
40  applyTheme(getStoredTheme());
41}
42
43// init on load
44document.addEventListener('DOMContentLoaded', initTheme);
45if (document.readyState !== 'loading') initTheme();