From fd35f4be8e799437ca79dd7e14c9edb07dc1ef39 Mon Sep 17 00:00:00 2001
From: rustmailer <pollybase@zohomail.com>
Date: Thu, 5 Mar 2026 15:59:50 +0800
Subject: [PATCH] fix: Sync settings modal doesn't fit on smaller viewport #168

---
 web/src/features/accounts/components/sync-folders.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/web/src/features/accounts/components/sync-folders.tsx b/web/src/features/accounts/components/sync-folders.tsx
index 61592e3..ed43a72 100644
--- a/web/src/features/accounts/components/sync-folders.tsx
+++ b/web/src/features/accounts/components/sync-folders.tsx
@@ -380,8 +380,8 @@ export function SyncFoldersDialog({ currentRow, open, onOpenChange }: Props) {
 
     return (
         <Dialog open={open} onOpenChange={onOpenChange}>
-            <DialogContent className="sm:max-w-3xl">
-                <DialogHeader>
+            <DialogContent className="sm:max-w-3xl max-h-[90vh] flex flex-col">
+                <DialogHeader className="flex-shrink-0">
                     <DialogTitle>{t('accounts.selectSyncFolders')}</DialogTitle>
                     <DialogDescription>
                         {t('accounts.chooseFoldersToSync', { "email": currentRow.email })}
@@ -455,7 +455,7 @@ export function SyncFoldersDialog({ currentRow, open, onOpenChange }: Props) {
                         </div>
                     </div>
 
-                    <ScrollArea className="h-[35rem] w-full pr-4 -mr-4 py-1">
+                    <ScrollArea className="flex-1 min-h-0 w-full pr-4 -mr-4 py-1">
                         {isLoading && (
                             <div className="p-8 space-y-8">
                                 <div className="flex flex-col items-center gap-3 text-muted-foreground">