Updating navbar to fix it

ArushYadlapati · Aug 16, 2024 · 9eb1e63 · 9eb1e63
1 parent c763c94
commit 9eb1e63
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 15 deletions.
diff --git a/app/components/homepage/about/index.jsx b/app/components/homepage/about/index.jsx
@@ -3,7 +3,6 @@
 import { personalData } from "@/utils/data/personal-data";
 import Image from "next/image";
 
-
 function AboutSection() {
   return (
     <div id="about" className="my-12 lg:my-16 relative">

diff --git a/app/components/navbar.jsx b/app/components/navbar.jsx
@@ -10,16 +10,14 @@ function Navbar() {
 
   useEffect(() => {
     const handleSmoothScroll = (e) => {
-      const href = e.currentTarget.href;
+      e.preventDefault();
+      const href = e.currentTarget.getAttribute('href');
       const targetId = href.replace(/.*\#/, "");
+
       if (targetId) {
-        e.preventDefault();
         const targetElement = document.getElementById(targetId);
         if (targetElement) {
-          targetElement.scrollIntoView({
-            behavior: "smooth"
-          });
-          // Update the URL without a page reload
+          targetElement.scrollIntoView({ behavior: "smooth" });
           window.history.pushState({}, '', href);
         }
       }
@@ -41,9 +39,7 @@ function Navbar() {
       <nav className="bg-transparent">
         <div className="flex items-center justify-between py-5">
           <div className="flex flex-shrink-0 items-center">
-            <Link
-                href="./"
-                className="text-[#16f2b3] text-3xl font-bold">
+            <Link href="./" className="text-[#16f2b3] text-3xl font-bold">
               arushyadlapati.com
             </Link>
           </div>
@@ -55,18 +51,24 @@ function Navbar() {
               </Link>
             </li>
             <li>
-              <Link className="block px-4 py-2 no-underline outline-none hover:no-underline" href="/#experience"><div className="text-sm text-white transition-colors duration-300 hover:text-pink-600">EXPERIENCE</div></Link>
+              <Link className="block px-4 py-2 no-underline outline-none hover:no-underline" href="/#experience">
+                <div className="text-sm text-white transition-colors duration-300 hover:text-pink-600">EXPERIENCE</div>
+              </Link>
             </li>
             <li>
-              <Link className="block px-4 py-2 no-underline outline-none hover:no-underline" href="/#skills"><div className="text-sm text-white transition-colors duration-300 hover:text-pink-600">SKILLS</div></Link>
+              <Link className="block px-4 py-2 no-underline outline-none hover:no-underline" href="/#skills">
+                <div className="text-sm text-white transition-colors duration-300 hover:text-pink-600">SKILLS</div>
+              </Link>
             </li>
             <li>
-              <Link className="block px-4 py-2 no-underline outline-none hover:no-underline" href="/#projects"><div className="text-sm text-white transition-colors duration-300 hover:text-pink-600">PROJECTS</div></Link>
+              <Link className="block px-4 py-2 no-underline outline-none hover:no-underline" href="/#projects">
+                <div className="text-sm text-white transition-colors duration-300 hover:text-pink-600">PROJECTS</div>
+              </Link>
             </li>
           </ul>
         </div>
       </nav>
   );
-};
+}
 
-export default Navbar;
+export default Navbar;