mirror of
https://github.com/veeso/termscp.git
synced 2026-07-14 03:53:44 +02:00
32 lines
1014 B
Plaintext
32 lines
1014 B
Plaintext
---
|
|
// Theme toggle. Contract: localStorage 'theme' = "frappe" | "latte". Safe to render multiple times.
|
|
---
|
|
<button
|
|
type="button"
|
|
data-theme-toggle
|
|
aria-label="Toggle theme"
|
|
aria-pressed="false"
|
|
class="rounded p-2 text-text hover:bg-mantle"
|
|
>
|
|
<span data-icon="frappe">☾</span>
|
|
<span data-icon="latte">☀</span>
|
|
</button>
|
|
<script is:inline>
|
|
(() => {
|
|
if (window.__themeToggleInit) return;
|
|
window.__themeToggleInit = true;
|
|
const root = document.documentElement;
|
|
const btns = document.querySelectorAll("[data-theme-toggle]");
|
|
const setPressed = () => btns.forEach((b) =>
|
|
b.setAttribute("aria-pressed", String(root.getAttribute("data-theme") === "latte")));
|
|
btns.forEach((b) =>
|
|
b.addEventListener("click", () => {
|
|
const next = root.getAttribute("data-theme") === "frappe" ? "latte" : "frappe";
|
|
root.setAttribute("data-theme", next);
|
|
localStorage.setItem("theme", next);
|
|
setPressed();
|
|
}));
|
|
setPressed();
|
|
})();
|
|
</script>
|