From 34bac88ab0009ad1758d44d861b7c6b6c1b42836 Mon Sep 17 00:00:00 2001
From: lethemanh <lethemanh@lethemanhs-MacBook-Pro.local>
Date: Mon, 13 Apr 2026 17:04:26 +0700
Subject: [PATCH] #777 limit date picker height on mobile

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

diff --git a/src/components/Menubar/components/DatePickerMobile.tsx b/src/components/Menubar/components/DatePickerMobile.tsx
index 74a9fb3..55c7470 100644
--- a/src/components/Menubar/components/DatePickerMobile.tsx
+++ b/src/components/Menubar/components/DatePickerMobile.tsx
@@ -128,7 +128,8 @@ export const DatePickerMobile: React.FC<DatePickerMobileProps> = ({
         sx={{
           width: '100%',
           marginTop: '10px',
-          minHeight: `${rootMinHeight}px`
+          minHeight: `${rootMinHeight}px`,
+          maxHeight: '300px'
         }}
         slotProps={{
           toolbar: { hidden: true },
@@ -138,7 +139,7 @@ export const DatePickerMobile: React.FC<DatePickerMobileProps> = ({
                 width: '100%',
                 margin: 0,
                 maxWidth: 'none',
-                maxHeight: 'none',
+                maxHeight: '400px',
                 height: `${calendarHeight}px`
               },
               '.MuiDayCalendar-header': {
@@ -150,7 +151,8 @@ export const DatePickerMobile: React.FC<DatePickerMobileProps> = ({
                 justifyContent: 'space-around'
               },
               '.MuiDateCalendar-root .MuiDayCalendar-slideTransition': {
-                minHeight: `${slideTransitionMinHeight}px`
+                minHeight: `${slideTransitionMinHeight}px`,
+                maxHeight: '300px'
               }
             }
           },