From 498d310c724db7f211f3a90f98e40654e72e9e96 Mon Sep 17 00:00:00 2001
From: Benno Tielen <Benno@tielen.nl>
Date: Wed, 24 Jun 2026 07:44:54 +0200
Subject: [PATCH] fix: display full menu on mobile

---
 src/components/MegaMenu/styles.module.scss | 4 ++--
 src/components/Menu/Menu.tsx               | 1 +
 src/components/Menu/styles.module.scss     | 6 +++++-
 3 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/components/MegaMenu/styles.module.scss b/src/components/MegaMenu/styles.module.scss
index 3ef15ed..678340b 100644
--- a/src/components/MegaMenu/styles.module.scss
+++ b/src/components/MegaMenu/styles.module.scss
@@ -87,7 +87,7 @@
   }
 
   .groupTitle {
-    margin: 0;
+    margin: 10px 0;
     color: $dark-text;
   }
 
@@ -103,7 +103,7 @@
 
   .item {
     flex: 1 1 40%;
-    height: 100px;
+    height: 80px;
     box-sizing: border-box;
     padding: 10px;
     background-color: $shade3;
diff --git a/src/components/Menu/Menu.tsx b/src/components/Menu/Menu.tsx
index 192fe48..5e62faa 100644
--- a/src/components/Menu/Menu.tsx
+++ b/src/components/Menu/Menu.tsx
@@ -71,6 +71,7 @@ const MegaMenuItem = ({text, quote, source, groups, onItemClick}: MegaMenuItemPr
       <Link
         href={""}
         className={styles.menuLink}
+        onClick={() => setIsActive(!isActive)}
       >
         {text} <CollapsibleArrow direction={isActive ? "UP" : "DOWN"} stroke={1.5} />
       </Link>
diff --git a/src/components/Menu/styles.module.scss b/src/components/Menu/styles.module.scss
index 79f12eb..53fa12a 100644
--- a/src/components/Menu/styles.module.scss
+++ b/src/components/Menu/styles.module.scss
@@ -77,7 +77,7 @@
 }
 
 .megaMenuActive {
-  max-height: 1000px;
+  max-height: 800px;
 }
 
 .search {
@@ -131,6 +131,10 @@
     position: inherit;
   }
 
+  .megaMenuActive {
+    max-height: 1500px;
+  }
+
   .navMobile {
     display: flex;
     align-items: center;