From d6f1146a3b43cfd301292f88cee9c1cb49b8b936 Mon Sep 17 00:00:00 2001
From: Tyler Hill <gotyhill@gmail.com>
Date: Fri, 26 Apr 2024 20:31:37 -0500
Subject: [PATCH] Scroll to ID, not by height

---
 src/components/WhoWeAre.tsx | 5 ++++-
 src/pages/index.tsx         | 5 ++++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/components/WhoWeAre.tsx b/src/components/WhoWeAre.tsx
index 2e7b1e0..c466db5 100644
--- a/src/components/WhoWeAre.tsx
+++ b/src/components/WhoWeAre.tsx
@@ -1,6 +1,9 @@
 function WhoWeAre() {
   return (
-    <div className="xl:pt-32 px-8 md:px-32 xl:px-64 flex justify-between flex-col lg:flex-row mx-auto font-inter gap-8 lg:gap-16 lg:text-left text-center my-16">
+    <div
+      id="who-we-are"
+      className="xl:pt-32 px-8 md:px-32 xl:px-64 flex justify-between flex-col lg:flex-row mx-auto font-inter gap-8 lg:gap-16 lg:text-left text-center my-16"
+    >
       <h1 className="font-bold lg:text-6xl text-2xl text-gradient leading-tight">
         Who&nbsp;We Are
       </h1>
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 5518eed..227deda 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -10,8 +10,11 @@ import CTA from '@/components/CTA';
 import Testimonials from '@/components/Testimonials';
 import Projects from '@/components/Projects';
 import Head from 'next/head';
+import { useRouter } from 'next/router';
 
 const Header = () => {
+  const router = useRouter();
+
   const [frames, bgStyles] = useBlobBg();
 
   return (
@@ -45,7 +48,7 @@ const Header = () => {
           src={Arrow}
           alt="Arrow"
           className="cursor-pointer hover:scale-105 transition-transform duration-300 ease-in-out [filter:_drop-shadow(0_0_4px_rgb(0_0_0_/_0.4))]"
-          onClick={() => window.scrollBy(0, window.innerHeight)}
+          onClick={() => router.replace('/#who-we-are')}
         />
       </div>
     </div>