mirror of
https://github.com/youwen5/site.git
synced 2024-11-24 17:33:51 -08:00
feat: add smooth scroll behavior, except on page change
This commit is contained in:
parent
9485a61226
commit
51d7318942
2 changed files with 21 additions and 0 deletions
|
@ -74,6 +74,9 @@
|
||||||
* {
|
* {
|
||||||
@apply border-border;
|
@apply border-border;
|
||||||
}
|
}
|
||||||
|
html.smoothscroll {
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
body {
|
body {
|
||||||
@apply bg-background text-foreground;
|
@apply bg-background text-foreground;
|
||||||
font-family:
|
font-family:
|
||||||
|
|
|
@ -8,6 +8,24 @@
|
||||||
import '@fontsource/merriweather/latin.css';
|
import '@fontsource/merriweather/latin.css';
|
||||||
import Footer from '$lib/components/Footer.svelte';
|
import Footer from '$lib/components/Footer.svelte';
|
||||||
import { Toaster } from '$lib/components/ui/sonner';
|
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');
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Toaster />
|
<Toaster />
|
||||||
|
|
Loading…
Reference in a new issue