jwright
f6d92e5c87
build-and-deploy / build (push) Failing after 14m48s
Unify scroll reveals, hero entrance, nav active-underline, button springs, the scroll-progress bar and backdrop parallax under one Motion system (src/scripts/anim.ts), bundled into a self-hosted /_astro module so CSP script-src 'self' holds. Progress bar + parallax now scroll()-driven and cross-browser (was Chromium-only animation-timeline). Fail-open, reduced-motion aware, content fully visible with JS off.
47 lines
1.8 KiB
JavaScript
47 lines
1.8 KiB
JavaScript
/* Single external script (no inline JS anywhere → strict script-src 'self').
|
|
Loaded blocking in <head> so the theme is set before first paint (no flash). */
|
|
(function () {
|
|
// --- Pre-paint theme -----------------------------------------------------
|
|
try {
|
|
var stored = localStorage.getItem("theme");
|
|
var theme =
|
|
stored ||
|
|
(window.matchMedia("(prefers-color-scheme: light)").matches ? "light" : "dark");
|
|
document.documentElement.dataset.theme = theme;
|
|
} catch (e) {
|
|
document.documentElement.dataset.theme = "dark";
|
|
}
|
|
|
|
// Mark JS as live BEFORE first paint. CSS only hides the pre-reveal animation
|
|
// state under `html.js`, so with JS off every element stays visible (the
|
|
// Motion layer in /_astro reveals them once it runs). Progressive enhancement.
|
|
document.documentElement.classList.add("js");
|
|
|
|
function onReady(fn) {
|
|
if (document.readyState !== "loading") fn();
|
|
else document.addEventListener("DOMContentLoaded", fn);
|
|
}
|
|
|
|
onReady(function () {
|
|
// --- Theme toggle ------------------------------------------------------
|
|
var btn = document.getElementById("theme-toggle");
|
|
if (btn) {
|
|
btn.addEventListener("click", function () {
|
|
var root = document.documentElement;
|
|
var next = root.dataset.theme === "light" ? "dark" : "light";
|
|
root.dataset.theme = next;
|
|
try {
|
|
localStorage.setItem("theme", next);
|
|
} catch (e) {
|
|
/* ignore */
|
|
}
|
|
});
|
|
}
|
|
|
|
// Scroll reveals, hero entrance, backdrop parallax, scroll-progress bar,
|
|
// nav underline and button springs all live in the Motion layer
|
|
// (src/scripts/anim.ts → bundled /_astro/*.js). This file owns only the
|
|
// pre-paint theme so it can stay a tiny blocking <head> script.
|
|
});
|
|
})();
|