diff --git a/src/lib/app.pcss b/src/lib/app.pcss index 90a3cfc..ab32552 100644 --- a/src/lib/app.pcss +++ b/src/lib/app.pcss @@ -74,6 +74,9 @@ * { @apply border-border; } + html.smoothscroll { + scroll-behavior: smooth; + } body { @apply bg-background text-foreground; font-family: diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index ce217b3..5c85e36 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -8,6 +8,24 @@ import '@fontsource/merriweather/latin.css'; import Footer from '$lib/components/Footer.svelte'; import { Toaster } from '$lib/components/ui/sonner'; + import { onMount } from 'svelte'; + import { afterNavigate, beforeNavigate } from '$app/navigation'; + + let root: HTMLElement | null; + + onMount(() => { + root = document.getElementsByTagName('html')[0]; + + root?.classList.add('smoothscroll'); + }); + + beforeNavigate(() => { + root?.classList.remove('smoothscroll'); + }); + + afterNavigate(() => { + root?.classList.add('smoothscroll'); + });