From 5ac47e2f437e5ac9af0a8d9e829b0c4f099595bd Mon Sep 17 00:00:00 2001
From: Daniel O'Neel <danieloneel@gmail.com>
Date: Mon, 8 Dec 2025 21:17:10 -0800
Subject: [PATCH 1/4] hide upload & download when bulk transactions selected

---
 .../BankTransactionsHeader.tsx                | 21 ++++++++++++-------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/src/components/BankTransactions/BankTransactionsHeader.tsx b/src/components/BankTransactions/BankTransactionsHeader.tsx
index aa209bd46..052131d2d 100644
--- a/src/components/BankTransactions/BankTransactionsHeader.tsx
+++ b/src/components/BankTransactions/BankTransactionsHeader.tsx
@@ -275,14 +275,19 @@ export const BankTransactionsHeader = ({
             </HStack>
           )}
         <TransactionsSearch slot='search' isDisabled={showBulkActions} />
-        <HStack slot='download-upload' justify='center' gap='xs'>
-          <DownloadButton
-            downloadButtonTextOverride={stringOverrides?.downloadButton}
-            iconOnly={listView}
-            disabled={showBulkActions}
-          />
-          <BankTransactionsHeaderMenu actions={headerMenuActions} isDisabled={showBulkActions} />
-        </HStack>
+
+        {showBulkActions
+          ? null
+          : (
+            <HStack slot='download-upload' justify='center' gap='xs'>
+              <DownloadButton
+                downloadButtonTextOverride={stringOverrides?.downloadButton}
+                iconOnly={listView}
+                disabled={showBulkActions}
+              />
+              <BankTransactionsHeaderMenu actions={headerMenuActions} isDisabled={showBulkActions} />
+            </HStack>
+          )}
       </BankTransactionsActions>
     </Header>
   )

From b493700d51b2659e33b3d38aa3ce65a2d5c3e55c Mon Sep 17 00:00:00 2001
From: Daniel O'Neel <danieloneel@gmail.com>
Date: Mon, 8 Dec 2025 21:30:47 -0800
Subject: [PATCH 2/4] bank transactions wider width

---
 .../BankTransactionsMobileBulkActionsHeader.tsx            | 2 +-
 src/styles/bank_transactions.scss                          | 7 +++++--
 src/styles/bank_transactions_mobile_list.scss              | 4 ++--
 3 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/components/BankTransactionsMobileList/BankTransactionsMobileBulkActionsHeader.tsx b/src/components/BankTransactionsMobileList/BankTransactionsMobileBulkActionsHeader.tsx
index 5ed7ef98b..cc3969c06 100644
--- a/src/components/BankTransactionsMobileList/BankTransactionsMobileBulkActionsHeader.tsx
+++ b/src/components/BankTransactionsMobileList/BankTransactionsMobileBulkActionsHeader.tsx
@@ -31,7 +31,7 @@ export const BankTransactionsMobileBulkActionsHeader = ({
   return (
     <HStack
       gap='md'
-      pi='lg'
+      pi='sm'
       pbs='md'
       justify='space-between'
       align='center'
diff --git a/src/styles/bank_transactions.scss b/src/styles/bank_transactions.scss
index ecdc996fe..6075dc7f6 100644
--- a/src/styles/bank_transactions.scss
+++ b/src/styles/bank_transactions.scss
@@ -829,8 +829,11 @@
   .Layer__bank-transactions__header {
     row-gap: var(--spacing-sm);
     padding-top: var(--spacing-md);
-    padding-right: var(--spacing-md);
-    padding-left: var(--spacing-md);
+    padding-right: 0;
+    padding-left: 0;
+
+    // padding-right: var(--spacing-md);
+    // padding-left: var(--spacing-md);
   }
 }
 
diff --git a/src/styles/bank_transactions_mobile_list.scss b/src/styles/bank_transactions_mobile_list.scss
index f60ec3f8b..f166f0250 100644
--- a/src/styles/bank_transactions_mobile_list.scss
+++ b/src/styles/bank_transactions_mobile_list.scss
@@ -8,11 +8,11 @@
 
 .Layer__bank-transaction-mobile-list-item {
   box-sizing: border-box;
-  width: 95%;
+  width: 100%;
   padding: 0;
   border-radius: var(--border-radius-sm);
   border: 1px solid var(--border-color);
-  margin: var(--spacing-2xs) var(--spacing-md);
+  margin: var(--spacing-2xs) 0;
   background: var(--color-base-0);
   cursor: pointer;
   user-select: none;

From e7509b308ecee0e6da2256347ee6def5492e9b53 Mon Sep 17 00:00:00 2001
From: Daniel O'Neel <danieloneel@gmail.com>
Date: Mon, 8 Dec 2025 21:43:52 -0800
Subject: [PATCH 3/4] css to make horizontal spacing more elegant

---
 .../BankTransactionsMobileBulkActionsHeader.tsx              | 4 ++--
 src/components/BulkActionsModule/BulkActionsModule.tsx       | 2 +-
 src/components/BulkActionsModule/bulkActionsModule.scss      | 5 +++++
 3 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/components/BankTransactionsMobileList/BankTransactionsMobileBulkActionsHeader.tsx b/src/components/BankTransactionsMobileList/BankTransactionsMobileBulkActionsHeader.tsx
index cc3969c06..75ac71282 100644
--- a/src/components/BankTransactionsMobileList/BankTransactionsMobileBulkActionsHeader.tsx
+++ b/src/components/BankTransactionsMobileList/BankTransactionsMobileBulkActionsHeader.tsx
@@ -31,8 +31,8 @@ export const BankTransactionsMobileBulkActionsHeader = ({
   return (
     <HStack
       gap='md'
-      pi='sm'
-      pbs='md'
+      pi='xs'
+      pbs='sm'
       justify='space-between'
       align='center'
     >
diff --git a/src/components/BulkActionsModule/BulkActionsModule.tsx b/src/components/BulkActionsModule/BulkActionsModule.tsx
index 1818cd65b..3df7adc7e 100644
--- a/src/components/BulkActionsModule/BulkActionsModule.tsx
+++ b/src/components/BulkActionsModule/BulkActionsModule.tsx
@@ -16,7 +16,7 @@ export const BulkActionsModule = ({ slots }: BulkActionsModuleProps) => {
   const { count } = useCountSelectedIds()
   const { clearSelection } = useBulkSelectionActions()
   return (
-    <HStack slot='toggle' justify='space-between' align='center' gap='xs'>
+    <HStack slot='toggle' justify='space-between' align='center' gap='xs' className='Layer__BulkActionsModule'>
       <HStack justify='space-between' align='center' pis='sm' pie='3xs' gap='3xs' className='Layer__BulkActionsModule__SelectedItemsContainer'>
         <Span noWrap>
           {`${count} selected`}
diff --git a/src/components/BulkActionsModule/bulkActionsModule.scss b/src/components/BulkActionsModule/bulkActionsModule.scss
index 71f59cdd4..54526d586 100644
--- a/src/components/BulkActionsModule/bulkActionsModule.scss
+++ b/src/components/BulkActionsModule/bulkActionsModule.scss
@@ -1,4 +1,9 @@
+.Layer__BulkActionsModule {
+  max-width: 100%;
+}
+
 .Layer__BulkActionsModule__SelectedItemsContainer {
+  flex-shrink: 0;
   height: 2.25rem;
   border-radius: var(--border-radius-2xs);
   border: 1px solid var(--color-base-300);

From 949cc8e91345c20a2269cc92967b732e06dff36c Mon Sep 17 00:00:00 2001
From: Daniel O'Neel <danieloneel@gmail.com>
Date: Mon, 8 Dec 2025 21:53:46 -0800
Subject: [PATCH 4/4] simplify applying styles only to mobile

---
 src/styles/bank_transactions.scss | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/styles/bank_transactions.scss b/src/styles/bank_transactions.scss
index 6075dc7f6..cb4491b43 100644
--- a/src/styles/bank_transactions.scss
+++ b/src/styles/bank_transactions.scss
@@ -829,11 +829,8 @@
   .Layer__bank-transactions__header {
     row-gap: var(--spacing-sm);
     padding-top: var(--spacing-md);
-    padding-right: 0;
-    padding-left: 0;
-
-    // padding-right: var(--spacing-md);
-    // padding-left: var(--spacing-md);
+    padding-right: var(--spacing-md);
+    padding-left: var(--spacing-md);
   }
 }
 
@@ -842,6 +839,8 @@
     position: sticky;
     z-index: 2;
     top: 0;
+    padding-right: 0;
+    padding-left: 0;
     border-top-left-radius: var(--border-radius-sm);
     border-top-right-radius: var(--border-radius-sm);
     box-shadow: 0 -1px 0 0 rgb(23 51 45 / 16%) inset;