diff options
Diffstat (limited to 'src/routes/+layout.svelte')
| -rw-r--r-- | src/routes/+layout.svelte | 17 |
1 files changed, 13 insertions, 4 deletions
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index a61d0a29..9ad33ca9 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -91,10 +91,19 @@ $: way = data.url.includes("/user") $: if ($navigating) isMenuOpen = false; +const reducesMotion = () => + window.matchMedia("(prefers-reduced-motion: reduce)").matches || + get(settings).displayDisableAnimations; + +$: if (browser) + document.documentElement.classList.toggle( + "reduce-motion", + $settings.displayDisableAnimations, + ); + onNavigate((navigation) => { if (!("startViewTransition" in document)) return; - if (window.matchMedia("(prefers-reduced-motion: reduce)").matches) return; - if (get(settings).displayDisableAnimations) return; + if (reducesMotion()) return; const fromPath = navigation.from?.url.pathname ?? "/"; const toPath = navigation.to?.url.pathname ?? "/"; @@ -138,7 +147,7 @@ const animateDetails = (e: MouseEvent) => { if (!summary) return; const details = summary.parentElement as HTMLDetailsElement | null; if (!details || details.tagName !== "DETAILS") return; - if (window.matchMedia("(prefers-reduced-motion: reduce)").matches) return; + if (reducesMotion()) return; e.preventDefault(); detailsAnimations.get(details)?.cancel(); @@ -182,7 +191,7 @@ const animateDetails = (e: MouseEvent) => { onMount(async () => { if (browser) { - if (!window.matchMedia("(prefers-reduced-motion: reduce)").matches) { + if (!reducesMotion()) { lenis = new Lenis({ autoRaf: true }); lenisStore.set(lenis); |