From 1a1296cc7c136ecfb19a96e28052eae2ceace76c Mon Sep 17 00:00:00 2001
From: hamid zarghami <hamid.zarghami1@gmail.com>
Date: Sun, 14 Dec 2025 15:42:55 +0330
Subject: [PATCH] fix design bug header:

---
 src/components/topbar/TopBar.tsx  |  2 +-
 src/components/utils/Dropdown.tsx | 11 ++++++++---
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/components/topbar/TopBar.tsx b/src/components/topbar/TopBar.tsx
index f6c3fcc..7a04fef 100644
--- a/src/components/topbar/TopBar.tsx
+++ b/src/components/topbar/TopBar.tsx
@@ -107,7 +107,7 @@ function TopBar({ profileDropState, toggleProfileDropState, toggleMenuState }: P
                         active={profileDropState}
                         toggle={toggleProfileDropState}
                     >
-                        <div className='place-items-center pt-8'>
+                        <div className='place-items-center flex flex-col items-center justify-center pt-8'>
                             <Image
                                 src={'/assets/images/avatar.svg'}
                                 width={56}
diff --git a/src/components/utils/Dropdown.tsx b/src/components/utils/Dropdown.tsx
index 5dbf0b8..37d4f74 100644
--- a/src/components/utils/Dropdown.tsx
+++ b/src/components/utils/Dropdown.tsx
@@ -40,16 +40,21 @@ function Dropdown({ active, toggle, children, ...rest }: DropdownProps) {
             transition={{ duration: 0.1 }}
             className={clsx(
                 'box-shadow-normal',
-                'fixed inset-0 bg-container rounded-normal z-50',
+                'fixed inset-x-0 bottom-0 bg-container rounded-normal z-50',
                 'xl:absolute xl:top-18 xl:left-3 xl:right-auto xl:h-screen xl:w-[300px]',
                 active === false && 'pointer-events-none'
             )}
+            style={{
+                top: 'calc(0px - env(safe-area-inset-top))',
+                paddingTop: 'calc(env(safe-area-inset-top) + 0px)',
+                minHeight: 'calc(100vh + env(safe-area-inset-top))'
+            }}
             {...rest}
         >
             <div className='relative w-full h-full'>
-                <button 
+                <button
                     ref={closeButtonRef}
-                    className='xl:hidden' 
+                    className='xl:hidden'
                     onClick={toggle} >
                     <CloseCircle size={20} className='cursor-pointer stroke-foreground absolute left-6 top-6' />
                 </button>