From 929428e18c9dffceb34b59ca3d445309f50504e9 Mon Sep 17 00:00:00 2001
From: daledah <daleda261@outlook.com>
Date: Thu, 5 Sep 2024 14:43:30 +0700
Subject: [PATCH 1/3] fix: correct bank icon styles and paddings

---
 .../EnableBankAccount/EnableBankAccount.tsx               | 5 +++--
 src/styles/index.ts                                       | 8 ++++++++
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/pages/ReimbursementAccount/EnableBankAccount/EnableBankAccount.tsx b/src/pages/ReimbursementAccount/EnableBankAccount/EnableBankAccount.tsx
index 599a7a1cf6f1..c73d6470eb18 100644
--- a/src/pages/ReimbursementAccount/EnableBankAccount/EnableBankAccount.tsx
+++ b/src/pages/ReimbursementAccount/EnableBankAccount/EnableBankAccount.tsx
@@ -40,7 +40,7 @@ function EnableBankAccount({reimbursementAccount, user, onBackButtonPress}: Enab
     const {translate} = useLocalize();
 
     const achData = reimbursementAccount?.achData ?? {};
-    const {icon, iconSize} = getBankIcon({bankName: achData.bankName, styles});
+    const {icon, iconSize, iconStyles} = getBankIcon({bankName: achData.bankName, styles});
     const isUsingExpensifyCard = user?.isUsingExpensifyCard;
     const formattedBankAccountNumber = achData.accountNumber ? `${translate('bankAccount.accountEnding')} ${achData.accountNumber.slice(-4)}` : '';
     const bankAccountOwnerName = achData.addressName;
@@ -76,11 +76,12 @@ function EnableBankAccount({reimbursementAccount, user, onBackButtonPress}: Enab
                             title={bankAccountOwnerName}
                             description={formattedBankAccountNumber}
                             icon={icon}
+                            iconStyles={iconStyles}
                             iconWidth={iconSize}
                             iconHeight={iconSize}
                             interactive={false}
                             displayInDefaultIconColor
-                            wrapperStyle={[styles.cardMenuItem, styles.mv3]}
+                            wrapperStyle={[styles.bankAccountMenuItem, styles.mv3]}
                         />
                         <Text style={[styles.mv3]}>
                             {!isUsingExpensifyCard ? translate('workspace.bankAccount.accountDescriptionNoCards') : translate('workspace.bankAccount.accountDescriptionWithCards')}
diff --git a/src/styles/index.ts b/src/styles/index.ts
index 179e886d08ff..eff3d99f3688 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -3772,6 +3772,14 @@ const styles = (theme: ThemeColors) =>
             alignItems: 'center',
         },
 
+        bankAccountMenuItem: {
+            paddingLeft: 0,
+            paddingRight: 0,
+            borderRadius: variables.buttonBorderRadius,
+            height: variables.componentSizeLarge,
+            alignItems: 'center',
+        },
+
         emptyCardSectionTitle: {
             fontSize: variables.fontSizeXLarge,
             lineHeight: variables.lineHeightXXLarge,

From c73ca91527751a2cee4bab1b99c2db4ec6167be0 Mon Sep 17 00:00:00 2001
From: daledah <daleda261@outlook.com>
Date: Sun, 8 Sep 2024 18:19:23 +0700
Subject: [PATCH 2/3] fix: remove redundant style

---
 src/styles/index.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/styles/index.ts b/src/styles/index.ts
index eff3d99f3688..95255afe9a66 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -3775,7 +3775,6 @@ const styles = (theme: ThemeColors) =>
         bankAccountMenuItem: {
             paddingLeft: 0,
             paddingRight: 0,
-            borderRadius: variables.buttonBorderRadius,
             height: variables.componentSizeLarge,
             alignItems: 'center',
         },

From c8d7b17a02ef3e34984c080badb364a60c8de76a Mon Sep 17 00:00:00 2001
From: daledah <daleda261@outlook.com>
Date: Tue, 10 Sep 2024 04:26:32 +0700
Subject: [PATCH 3/3] fix: remove new unused styles

---
 .../EnableBankAccount/EnableBankAccount.tsx                | 2 +-
 src/styles/index.ts                                        | 7 -------
 2 files changed, 1 insertion(+), 8 deletions(-)

diff --git a/src/pages/ReimbursementAccount/EnableBankAccount/EnableBankAccount.tsx b/src/pages/ReimbursementAccount/EnableBankAccount/EnableBankAccount.tsx
index cc00aef37b6e..1d8ce04d7f71 100644
--- a/src/pages/ReimbursementAccount/EnableBankAccount/EnableBankAccount.tsx
+++ b/src/pages/ReimbursementAccount/EnableBankAccount/EnableBankAccount.tsx
@@ -72,7 +72,7 @@ function EnableBankAccount({reimbursementAccount, onBackButtonPress}: EnableBank
                             iconHeight={iconSize}
                             interactive={false}
                             displayInDefaultIconColor
-                            wrapperStyle={[styles.bankAccountMenuItem, styles.mv3]}
+                            wrapperStyle={[styles.ph0, styles.mv3, styles.h13]}
                         />
                         <Text style={[styles.mv3]}>{translate('workspace.bankAccount.accountDescriptionWithCards')}</Text>
                         <MenuItem
diff --git a/src/styles/index.ts b/src/styles/index.ts
index 95255afe9a66..179e886d08ff 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -3772,13 +3772,6 @@ const styles = (theme: ThemeColors) =>
             alignItems: 'center',
         },
 
-        bankAccountMenuItem: {
-            paddingLeft: 0,
-            paddingRight: 0,
-            height: variables.componentSizeLarge,
-            alignItems: 'center',
-        },
-
         emptyCardSectionTitle: {
             fontSize: variables.fontSizeXLarge,
             lineHeight: variables.lineHeightXXLarge,