Smooth scroll for anchor link

src/functions.js

@@ -39,6 +39,20 @@ export const isInViewport = element => {
 }
 
 
+
+/*
+** Smooth Scroll
+*/
+export const smoothScroll = (event, element = null) => {
+    document.querySelector(element).scrollIntoView({
+        behavior: 'smooth',
+        block: 'start'
+    })
+    event.preventDefault()
+}
+
+
+
 /*
 ** Random String Generator
 */

src/routes/index.svelte

@@ -99,7 +99,7 @@
         <div class="intro__description style-description">
             <p>{$site.description}</p>
 
-            <Button href="#choose" type="a" className="button" text="Explore locations">
+            <Button type="a" href="#choose" className="button" text="Explore locations" on:click={e => fn.smoothScroll(e, '#choose')}>
                 <IconGlobeSmall width="22" color="#666" />
             </Button>
         </div>