From eb8141ee8c3d32bce901457178d50781b78f86dd Mon Sep 17 00:00:00 2001
From: Aiyaz Mostofa <127061437+aiyazmostofa@users.noreply.github.com>
Date: Sun, 8 Jun 2025 22:54:36 -0500
Subject: [PATCH] fix: limit height of schedule list dropdown in the extension
 popup (#543)

* fix: limit height of schedule list dropdown in the extension popup

* fix: limit the entire dropdown to 200px, not just the schedule list

* fix: use flexbox for dropdown and wedge scrollbar inside margin

* fix: use DisclosurePanel in schedule dropdown, do Uno class sorting

---------

Co-authored-by: Ethan Lanting <ethanlanting@gmail.com>
Co-authored-by: Samuel Gunter <29130894+Samathingamajig@users.noreply.github.com>
Co-authored-by: doprz <52579214+doprz@users.noreply.github.com>
---
 src/views/components/common/ScheduleDropdown.tsx | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/views/components/common/ScheduleDropdown.tsx b/src/views/components/common/ScheduleDropdown.tsx
index 57173a78..d75261dd 100644
--- a/src/views/components/common/ScheduleDropdown.tsx
+++ b/src/views/components/common/ScheduleDropdown.tsx
@@ -19,7 +19,7 @@ export default function ScheduleDropdown({ defaultOpen, children }: ScheduleDrop
     const [activeSchedule] = useSchedules();
 
     return (
-        <div className='border border-ut-offwhite/50 rounded bg-white'>
+        <div className='max-h-[200px] flex flex-col border border-ut-offwhite/50 rounded bg-white'>
             <Disclosure defaultOpen={defaultOpen}>
                 {({ open }) => (
                     <>
@@ -54,17 +54,17 @@ export default function ScheduleDropdown({ defaultOpen, children }: ScheduleDrop
 
                         <Transition
                             as='div'
-                            className='overflow-hidden'
+                            className='flex flex-1 flex-col overflow-y-hidden'
                             enter='transition-[max-height,opacity,padding] duration-300 ease-in-out-expo'
                             enterFrom='max-h-0 opacity-0 p-0.5'
-                            enterTo='max-h-[440px] opacity-100 p-0'
+                            enterTo='max-h-[200px] opacity-100 p-0'
                             leave='transition-[max-height,opacity,padding] duration-300 ease-in-out-expo'
-                            leaveFrom='max-h-[440px] opacity-100 p-0'
+                            leaveFrom='max-h-[200px] opacity-100 p-0'
                             leaveTo='max-h-0 opacity-0 p-0.5'
                         >
-                            <div className='px-3.5 pb-2.5 pt-2'>
-                                <DisclosurePanel>{children}</DisclosurePanel>
-                            </div>
+                            <DisclosurePanel className='mx-1.75 mb-2.5 mt-2 flex flex-1 flex-col overflow-y-auto'>
+                                <div className='mx-1.75'>{children}</div>
+                            </DisclosurePanel>
                         </Transition>
                     </>
                 )}