website: smooth scroll

vikejs · Oct 7, 2024 · 51ed8ef · 51ed8ef
1 parent c2ca54f
commit 51ed8ef
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 1 deletion.
diff --git a/docs/pages/index/+Page.tsx b/docs/pages/index/+Page.tsx
@@ -1,11 +1,17 @@
 export { Page }
 
-import React from 'react'
+import React, { useEffect } from 'react'
 import { Header } from './Header'
 import { Features } from './Features'
 import { Contributors, Sponsors } from '@brillout/docpress'
 
 function Page() {
+  useEffect(() => {
+    const cl = document.documentElement.classList
+    const cls = 'scroll-behavior-smooth'
+    cl.add(cls)
+    return () => cl.remove(cls)
+  })
   return (
     <>
       <Header />

diff --git a/docs/pages/index/FeaturesLayout.css b/docs/pages/index/FeaturesLayout.css
@@ -1,3 +1,6 @@
+html.scroll-behavior-smooth {
+  scroll-behavior: smooth;
+}
 #feature-list h2 {
   font-size: 2.2em;
   padding-top: 50px;