From b95a1f02ac48ccdcab99c27b872503868d4cb4af Mon Sep 17 00:00:00 2001
From: Tanuj Nainwal <nainwaltanuj9389@gmail.com>
Date: Sat, 7 Dec 2024 12:53:41 +0530
Subject: [PATCH 1/9] updated font size and height of showDropdown component

---
 components/header.tsx | 14 +++++++-------
 package-lock.json     | 14 ++++++++------
 2 files changed, 15 insertions(+), 13 deletions(-)

diff --git a/components/header.tsx b/components/header.tsx
index 05b476b..529643b 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -252,13 +252,13 @@ export default function Header(props: { fixed?: boolean }) {
       }`}
       id="header"
     >
-      <div
-        className={`absolute inset-x-0 h-full bg-white/70 backdrop-blur-xl -z-10 transition-all ${
+      <div 
+      className={`absolute inset-x-0 h-full bg-white/70 backdrop-blur-xl -z-10 transition-all ${
           scrolled ? "top-0" : "-top-full"
         }`}
       />
       <nav
-        className={`flex relative items-stretch justify-between transition-all px-4 md:px-6 lg:px-8`}
+        className={`flex relative items-stretch justify-between transition-all px-4 md:px-6 lg:px-8 text-[5px]`}
         aria-label="Global"
       >
         <div
@@ -296,11 +296,11 @@ export default function Header(props: { fixed?: boolean }) {
           </button>
         </div>
         <div
-          className={`flex md:items-center p-6 md:p-0 fixed ${
-            mobileMenuOpen ? "right-0" : "right-[-100vw]"
+          className={`flex md:items-center p-6 md:p-0 fixed text-[30px] ${
+            mobileMenuOpen ? "right-0" : "right-[-100vw] text-[30px]"
           } md:right-auto transition-all md:static ${
             scrolled ? "bg-white/50" : "bg-black/50"
-          } pb-[300px] md:pb-0 md:bg-transparent backdrop-blur-lg md:backdrop-blur-none h-screen md:h-auto top-0 md:top-auto w-screen md:w-auto flex-col md:flex-row text-5xl md:text-base`}
+          } pb-[300px] md:pb-0 md:bg-transparent backdrop-blur-lg md:backdrop-blur-none h-screen md:h-auto top-0 md:top-auto w-screen md:w-auto flex-col md:flex-row md:text-base`}
         >
           <button
             className="md:hidden block absolute top-6 right-8"
@@ -347,7 +347,7 @@ export default function Header(props: { fixed?: boolean }) {
         className={`nav-dropdown ${scrolled ? "bg-black/5" : "bg-black/20"} ${
           scrolled ? "" : "backdrop-blur md:rounded-xl md:mx-10"
         } transition-all overflow-hidden fixed bottom-0 md:bottom-auto inset-x-0 md:inset-x-auto md:relative ${
-          !!showDropdown ? "max-h-[400px]" : "max-h-0"
+          !!showDropdown ? " max-h-[300px]" : "max-h-0"
         }`}
         style={{ height: dropDownHeight }}
       >
diff --git a/package-lock.json b/package-lock.json
index 9e175ce..27c2fd7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1375,10 +1375,11 @@
       "dev": true
     },
     "node_modules/cross-spawn": {
-      "version": "7.0.3",
-      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
-      "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
+      "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "path-key": "^3.1.0",
         "shebang-command": "^2.0.0",
@@ -3286,10 +3287,11 @@
       }
     },
     "node_modules/micromatch": {
-      "version": "4.0.7",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.7.tgz",
-      "integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==",
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "braces": "^3.0.3",
         "picomatch": "^2.3.1"

From 82b511b213dacfdc7e494bf04449d823b20c1d51 Mon Sep 17 00:00:00 2001
From: Tanuj Nainwal <nainwaltanuj9389@gmail.com>
Date: Sat, 7 Dec 2024 17:14:04 +0530
Subject: [PATCH 2/9] revert changes in lockfile and use predefined size

---
 components/header.tsx |  8 ++++----
 package-lock.json     | 14 ++++++--------
 2 files changed, 10 insertions(+), 12 deletions(-)

diff --git a/components/header.tsx b/components/header.tsx
index 529643b..6ad87a9 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -258,7 +258,7 @@ export default function Header(props: { fixed?: boolean }) {
         }`}
       />
       <nav
-        className={`flex relative items-stretch justify-between transition-all px-4 md:px-6 lg:px-8 text-[5px]`}
+        className={`flex relative items-stretch justify-between transition-all px-4 md:px-6 lg:px-8 text-xs`}
         aria-label="Global"
       >
         <div
@@ -296,8 +296,8 @@ export default function Header(props: { fixed?: boolean }) {
           </button>
         </div>
         <div
-          className={`flex md:items-center p-6 md:p-0 fixed text-[30px] ${
-            mobileMenuOpen ? "right-0" : "right-[-100vw] text-[30px]"
+          className={`flex md:items-center p-6 md:p-0 fixed text-2xl ${
+            mobileMenuOpen ? "right-0" : "right-[-100vw] text-2xl"
           } md:right-auto transition-all md:static ${
             scrolled ? "bg-white/50" : "bg-black/50"
           } pb-[300px] md:pb-0 md:bg-transparent backdrop-blur-lg md:backdrop-blur-none h-screen md:h-auto top-0 md:top-auto w-screen md:w-auto flex-col md:flex-row md:text-base`}
@@ -347,7 +347,7 @@ export default function Header(props: { fixed?: boolean }) {
         className={`nav-dropdown ${scrolled ? "bg-black/5" : "bg-black/20"} ${
           scrolled ? "" : "backdrop-blur md:rounded-xl md:mx-10"
         } transition-all overflow-hidden fixed bottom-0 md:bottom-auto inset-x-0 md:inset-x-auto md:relative ${
-          !!showDropdown ? " max-h-[300px]" : "max-h-0"
+          !!showDropdown ? " max-h-xs" : "max-h-0"
         }`}
         style={{ height: dropDownHeight }}
       >
diff --git a/package-lock.json b/package-lock.json
index 27c2fd7..9e175ce 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1375,11 +1375,10 @@
       "dev": true
     },
     "node_modules/cross-spawn": {
-      "version": "7.0.6",
-      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
-      "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==",
+      "version": "7.0.3",
+      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
+      "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "path-key": "^3.1.0",
         "shebang-command": "^2.0.0",
@@ -3287,11 +3286,10 @@
       }
     },
     "node_modules/micromatch": {
-      "version": "4.0.8",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
-      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
+      "version": "4.0.7",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.7.tgz",
+      "integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==",
       "dev": true,
-      "license": "MIT",
       "dependencies": {
         "braces": "^3.0.3",
         "picomatch": "^2.3.1"

From 1b833dd1a99755dc36ec7e87905ae041f15fda45 Mon Sep 17 00:00:00 2001
From: Tanuj Nainwal <nainwaltanuj9389@gmail.com>
Date: Tue, 17 Dec 2024 20:55:10 +0530
Subject: [PATCH 3/9] improve mobile view for menu

---
 components/header.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/components/header.tsx b/components/header.tsx
index 6ad87a9..07a4029 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -93,7 +93,9 @@ export default function Header(props: { fixed?: boolean }) {
           width={50}
           height={50}
           className={`md:w-[25px] ${
-            scrolled ? "brightness-0" : ""
+            scrolled ? "brightness-0" : "" 
+          } ${
+            mobileMenuOpen?"pt-6":""
           } transition-all`}
         />
       ),
@@ -308,6 +310,7 @@ export default function Header(props: { fixed?: boolean }) {
           >
             <XMarkIcon className="h-6 w-6" aria-hidden="true" />
           </button>
+          <div className={`${mobileMenuOpen ? "h-12" : "flex flex-row" }`}>
           {navigation.map((item, i) => (
             <NavigationItemRender
               item={item}
@@ -323,6 +326,7 @@ export default function Header(props: { fixed?: boolean }) {
               }}
             />
           ))}
+          </div>
         </div>
         <svg
           id="dropdown-triangle"

From c59a6fa4dee3ad6557ac1232354ed30960c7f5c1 Mon Sep 17 00:00:00 2001
From: Tanuj Nainwal <nainwaltanuj9389@gmail.com>
Date: Wed, 18 Dec 2024 17:28:25 +0530
Subject: [PATCH 4/9] clicking on item will close the menu

---
 components/header.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/components/header.tsx b/components/header.tsx
index 07a4029..ff4998c 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -167,6 +167,7 @@ export default function Header(props: { fixed?: boolean }) {
                 document
                   .getElementById(item.id)
                   ?.scrollIntoView({ behavior: "smooth" });
+                  setMobileMenuOpen(false)
               } else {
                 router.push(item.page + "#" + item.id);
               }

From 53f261a54d13df4c7749ba33dd6dac44087d19e3 Mon Sep 17 00:00:00 2001
From: Tanuj Nainwal <nainwaltanuj9389@gmail.com>
Date: Thu, 19 Dec 2024 10:33:25 +0530
Subject: [PATCH 5/9] clicking on item will close the menu

---
 components/header.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/header.tsx b/components/header.tsx
index ff4998c..bbc6ab3 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -82,7 +82,7 @@ export default function Header(props: { fixed?: boolean }) {
   const navigation: NavigationItem[] = [
     { type: "dropdown", content: "Products", items: productsItems },
     { type: "dropdown", content: "Community", items: communityItems },
-    { type: "link", content: "Supporters", href: "/supporters" },
+    { type: "section", content: "Supporters", id: "supporters", page: "/supporters" },
     { type: "section", content: "Contact", id: "contact", page: "/" },
     {
       type: "link",
@@ -151,7 +151,7 @@ export default function Header(props: { fixed?: boolean }) {
     switch (item.type) {
       case "link":
         return (
-          <Link href={item.href} className={className}>
+          <Link href={item.href} className={className} >
             {item.content}
           </Link>
         );
@@ -161,13 +161,13 @@ export default function Header(props: { fixed?: boolean }) {
             href={item.page + "#" + item.id}
             className={className}
             onClick={(e) => {
+              setMobileMenuOpen(false)
               e.preventDefault();
               e.stopPropagation();
               if (path === item.page) {
                 document
                   .getElementById(item.id)
                   ?.scrollIntoView({ behavior: "smooth" });
-                  setMobileMenuOpen(false)
               } else {
                 router.push(item.page + "#" + item.id);
               }

From 3552141d611c24a166ee35233c418fbdfb4c6dd2 Mon Sep 17 00:00:00 2001
From: Tanuj Nainwal <nainwaltanuj9389@gmail.com>
Date: Thu, 19 Dec 2024 20:52:10 +0530
Subject: [PATCH 6/9] clicking on item will close the menu

---
 components/header.tsx | 53 ++++++++++++++++++++++++++-----------------
 1 file changed, 32 insertions(+), 21 deletions(-)

diff --git a/components/header.tsx b/components/header.tsx
index bbc6ab3..1dcf724 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -139,19 +139,21 @@ export default function Header(props: { fixed?: boolean }) {
   const NavigationItemRender = (props: {
     item: NavigationItem;
     onHover?: (hoverstate: boolean, leftOffset: number) => void;
+    setMobileMenuOpen: (state: boolean) => void;
+    setShowDropdown: (state: number | null) => void;
   }) => {
-    const { item, onHover } = props;
-
+    const { item, onHover, setMobileMenuOpen, setShowDropdown } = props;
+  
     const className = `font-black md:font-semibold ${
       scrolled ? "md:hover:text-black/100" : "md:hover:text-white/100"
     } transition-all px-3 flex items-center md:justify-center h-full`;
-
+  
     const itemRef = useRef<HTMLButtonElement>(null);
-
+  
     switch (item.type) {
       case "link":
         return (
-          <Link href={item.href} className={className} >
+          <Link href={item.href} className={className}>
             {item.content}
           </Link>
         );
@@ -161,7 +163,7 @@ export default function Header(props: { fixed?: boolean }) {
             href={item.page + "#" + item.id}
             className={className}
             onClick={(e) => {
-              setMobileMenuOpen(false)
+              setMobileMenuOpen(false);
               e.preventDefault();
               e.stopPropagation();
               if (path === item.page) {
@@ -201,6 +203,9 @@ export default function Header(props: { fixed?: boolean }) {
                   (itemRef.current?.clientWidth || 0) / 2
               );
             }}
+            onClick={() => {
+              setShowDropdown(item.items ? item.items.length : null);
+            }}
           >
             {item.content}
           </button>
@@ -226,6 +231,10 @@ export default function Header(props: { fixed?: boolean }) {
             className={`p-4 w-[200px] text-left rounded-lg ${
               scrolled ? "hover:bg-black/5" : "hover:bg-black/10"
             } transition-all flex flex-col gap-2`}
+            onClick={() => {
+              setMobileMenuOpen(false);
+              setShowDropdown(null);
+            }}
           >
             <Image
               src={item.image}
@@ -312,21 +321,23 @@ export default function Header(props: { fixed?: boolean }) {
             <XMarkIcon className="h-6 w-6" aria-hidden="true" />
           </button>
           <div className={`${mobileMenuOpen ? "h-12" : "flex flex-row" }`}>
-          {navigation.map((item, i) => (
-            <NavigationItemRender
-              item={item}
-              key={i}
-              onHover={(hoverstate, leftOffset) => {
-                if (hoverstate) {
-                  setShowDropdown(i + 1);
-                  triangleRef.current?.style.setProperty(
-                    "left",
-                    `${leftOffset - triangleRef.current.clientWidth / 2}px`
-                  );
-                }
-              }}
-            />
-          ))}
+            {navigation.map((item, i) => (
+              <NavigationItemRender
+                item={item}
+                key={i}
+                setMobileMenuOpen={setMobileMenuOpen}
+                setShowDropdown={setShowDropdown}
+                onHover={(hoverstate, leftOffset) => {
+                  if (hoverstate) {
+                    setShowDropdown(i + 1);
+                    triangleRef.current?.style.setProperty(
+                      "left",
+                      `${leftOffset - triangleRef.current.clientWidth / 2}px`
+                    );
+                  }
+                }}
+              />
+            ))}
           </div>
         </div>
         <svg

From 8c3de684b13e6a2cc0f0e1435f71bef7e9422782 Mon Sep 17 00:00:00 2001
From: Tanuj Nainwal <nainwaltanuj9389@gmail.com>
Date: Sun, 22 Dec 2024 00:12:19 +0530
Subject: [PATCH 7/9] updated the dekstop version

---
 components/header.tsx | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/components/header.tsx b/components/header.tsx
index 1dcf724..8c8695b 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -95,7 +95,7 @@ export default function Header(props: { fixed?: boolean }) {
           className={`md:w-[25px] ${
             scrolled ? "brightness-0" : "" 
           } ${
-            mobileMenuOpen?"pt-6":""
+            mobileMenuOpen?"pb-44 pt-4 m-0":""
           } transition-all`}
         />
       ),
@@ -161,7 +161,7 @@ export default function Header(props: { fixed?: boolean }) {
         return (
           <Link
             href={item.page + "#" + item.id}
-            className={className}
+            className={`${className} ${mobileMenuOpen?"h-3 p-6":"h-full"}`}
             onClick={(e) => {
               setMobileMenuOpen(false);
               e.preventDefault();
@@ -188,7 +188,7 @@ export default function Header(props: { fixed?: boolean }) {
         return (
           <button
             ref={itemRef}
-            className={"nav-button " + className}
+            className={`nav-button ${className} ${mobileMenuOpen?"h-3 p-6":"h-full"}`}
             onMouseOver={() => {
               onHover?.(
                 true,
@@ -320,7 +320,6 @@ export default function Header(props: { fixed?: boolean }) {
           >
             <XMarkIcon className="h-6 w-6" aria-hidden="true" />
           </button>
-          <div className={`${mobileMenuOpen ? "h-12" : "flex flex-row" }`}>
             {navigation.map((item, i) => (
               <NavigationItemRender
                 item={item}
@@ -338,7 +337,6 @@ export default function Header(props: { fixed?: boolean }) {
                 }}
               />
             ))}
-          </div>
         </div>
         <svg
           id="dropdown-triangle"

From d53707b057a34cfddaf4b029bd6c26799d611c61 Mon Sep 17 00:00:00 2001
From: Tanuj Nainwal <nainwaltanuj9389@gmail.com>
Date: Tue, 24 Dec 2024 23:55:16 +0530
Subject: [PATCH 8/9] changes section to link for support tab

---
 components/header.tsx | 66 +++++++++++++++++++++----------------------
 1 file changed, 33 insertions(+), 33 deletions(-)

diff --git a/components/header.tsx b/components/header.tsx
index 8c8695b..0f0c9f1 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -82,7 +82,7 @@ export default function Header(props: { fixed?: boolean }) {
   const navigation: NavigationItem[] = [
     { type: "dropdown", content: "Products", items: productsItems },
     { type: "dropdown", content: "Community", items: communityItems },
-    { type: "section", content: "Supporters", id: "supporters", page: "/supporters" },
+    { type: "link", content: "Supporters", href: "/supporters" },
     { type: "section", content: "Contact", id: "contact", page: "/" },
     {
       type: "link",
@@ -94,8 +94,6 @@ export default function Header(props: { fixed?: boolean }) {
           height={50}
           className={`md:w-[25px] ${
             scrolled ? "brightness-0" : "" 
-          } ${
-            mobileMenuOpen?"pb-44 pt-4 m-0":""
           } transition-all`}
         />
       ),
@@ -153,7 +151,7 @@ export default function Header(props: { fixed?: boolean }) {
     switch (item.type) {
       case "link":
         return (
-          <Link href={item.href} className={className}>
+          <Link href={item.href} className={`${className} ${mobileMenuOpen?"h-2 p-6":"h-full"}`}>
             {item.content}
           </Link>
         );
@@ -161,7 +159,7 @@ export default function Header(props: { fixed?: boolean }) {
         return (
           <Link
             href={item.page + "#" + item.id}
-            className={`${className} ${mobileMenuOpen?"h-3 p-6":"h-full"}`}
+            className={`${className} ${mobileMenuOpen?"h-1 p-6 ":"h-full"}`}
             onClick={(e) => {
               setMobileMenuOpen(false);
               e.preventDefault();
@@ -184,33 +182,35 @@ export default function Header(props: { fixed?: boolean }) {
             {item.content}
           </button>
         );
-      case "dropdown":
-        return (
-          <button
-            ref={itemRef}
-            className={`nav-button ${className} ${mobileMenuOpen?"h-3 p-6":"h-full"}`}
-            onMouseOver={() => {
-              onHover?.(
-                true,
-                (itemRef.current?.getBoundingClientRect().left || 0) +
-                  (itemRef.current?.clientWidth || 0) / 2
-              );
-            }}
-            onMouseOut={() => {
-              onHover?.(
-                false,
-                (itemRef.current?.getBoundingClientRect().left || 0) +
-                  (itemRef.current?.clientWidth || 0) / 2
-              );
-            }}
-            onClick={() => {
-              setShowDropdown(item.items ? item.items.length : null);
-            }}
-          >
-            {item.content}
-          </button>
-        );
-    }
+        case "dropdown":
+          return (
+            <button
+              ref={itemRef}
+              className={`nav-button md:font-semibold ${scrolled ? "md:hover:text-black/100" : "md:hover:text-white/100"} 
+                ${mobileMenuOpen ? "p-1 font-bold" : "h-full"} 
+                transition-all px-3 flex items-center md:justify-center`}
+              onMouseOver={() => {
+                onHover?.(
+                  true,
+                  (itemRef.current?.getBoundingClientRect().left || 0) +
+                    (itemRef.current?.clientWidth || 0) / 2
+                );
+              }}
+              onMouseOut={() => {
+                onHover?.(
+                  false,
+                  (itemRef.current?.getBoundingClientRect().left || 0) +
+                    (itemRef.current?.clientWidth || 0) / 2
+                );
+              }}
+              onClick={() => {
+                setShowDropdown(item.items ? item.items.length : null);
+              }}
+            >
+              {item.content}
+            </button>
+          );
+        }
   };
 
   const DropDownRender = (props: {
@@ -230,7 +230,7 @@ export default function Header(props: { fixed?: boolean }) {
             key={i}
             className={`p-4 w-[200px] text-left rounded-lg ${
               scrolled ? "hover:bg-black/5" : "hover:bg-black/10"
-            } transition-all flex flex-col gap-2`}
+            } transition-all flex flex-col gap-2 `}
             onClick={() => {
               setMobileMenuOpen(false);
               setShowDropdown(null);

From 7fb1912b2dba85864aa89d084122fb997331ed3c Mon Sep 17 00:00:00 2001
From: Tanuj Nainwal <nainwaltanuj9389@gmail.com>
Date: Tue, 31 Dec 2024 20:16:12 +0530
Subject: [PATCH 9/9] updated height and padding of containers

---
 components/header.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/components/header.tsx b/components/header.tsx
index 0f0c9f1..6b8a81a 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -151,7 +151,8 @@ export default function Header(props: { fixed?: boolean }) {
     switch (item.type) {
       case "link":
         return (
-          <Link href={item.href} className={`${className} ${mobileMenuOpen?"h-2 p-6":"h-full"}`}>
+          <Link href={item.href} className={`${className} ${mobileMenuOpen?"!h-auto !py-2":"h-full"}`} 
+          onClick={() => setMobileMenuOpen(false) } >
             {item.content}
           </Link>
         );
@@ -159,7 +160,7 @@ export default function Header(props: { fixed?: boolean }) {
         return (
           <Link
             href={item.page + "#" + item.id}
-            className={`${className} ${mobileMenuOpen?"h-1 p-6 ":"h-full"}`}
+            className={`${className} ${mobileMenuOpen?"!h-auto !py-2":"h-full"}`}
             onClick={(e) => {
               setMobileMenuOpen(false);
               e.preventDefault();