From fd99c784b3cad504d0e9a0119ee58bdf85d9b063 Mon Sep 17 00:00:00 2001
From: MaysWind <i@mayswind.net>
Date: Mon, 28 Jul 2025 22:00:25 +0800
Subject: [PATCH] modify style

---
 src/styles/mobile/font-size-default.css       |  1 +
 src/styles/mobile/font-size-large.css         |  1 +
 src/styles/mobile/font-size-small.css         |  1 +
 src/styles/mobile/font-size-x-large.css       |  1 +
 src/styles/mobile/font-size-xx-large.css      |  1 +
 src/styles/mobile/font-size-xxx-large.css     |  1 +
 src/styles/mobile/font-size-xxxx-large.css    |  1 +
 src/views/mobile/accounts/ListPage.vue        |  2 +-
 .../accounts/ReconciliationStatementPage.vue  | 34 ++++++++++++-------
 9 files changed, 30 insertions(+), 13 deletions(-)

diff --git a/src/styles/mobile/font-size-default.css b/src/styles/mobile/font-size-default.css
index 591a221f..16ac8e85 100644
--- a/src/styles/mobile/font-size-default.css
+++ b/src/styles/mobile/font-size-default.css
@@ -73,6 +73,7 @@
     --ebk-trends-bar-chart-legend-icon-font-size: 18px;
     --ebk-trends-bar-chart-legend-text-font-size: 14px;
     --ebk-account-list-group-title-height: 36px;
+    --ebk-reconciliation-statement-list-group-title-height: 36px;
     --ebk-synchronized-settings-list-group-title-height: 36px;
     --ebk-synchronized-settings-list-device-icon-font-size: 19px;
     --ebk-category-separate-icon-font-size: 18px;
diff --git a/src/styles/mobile/font-size-large.css b/src/styles/mobile/font-size-large.css
index 368fe109..00e2e851 100644
--- a/src/styles/mobile/font-size-large.css
+++ b/src/styles/mobile/font-size-large.css
@@ -73,6 +73,7 @@
     --ebk-trends-bar-chart-legend-icon-font-size: 19px;
     --ebk-trends-bar-chart-legend-text-font-size: 15px;
     --ebk-account-list-group-title-height: 37px;
+    --ebk-reconciliation-statement-list-group-title-height: 37px;
     --ebk-synchronized-settings-list-group-title-height: 37px;
     --ebk-synchronized-settings-list-device-icon-font-size: 20px;
     --ebk-category-separate-icon-font-size: 18px;
diff --git a/src/styles/mobile/font-size-small.css b/src/styles/mobile/font-size-small.css
index 35bf38d2..af456f82 100644
--- a/src/styles/mobile/font-size-small.css
+++ b/src/styles/mobile/font-size-small.css
@@ -73,6 +73,7 @@
     --ebk-trends-bar-chart-legend-icon-font-size: 16px;
     --ebk-trends-bar-chart-legend-text-font-size: 12px;
     --ebk-account-list-group-title-height: 36px;
+    --ebk-reconciliation-statement-list-group-title-height: 36px;
     --ebk-synchronized-settings-list-group-title-height: 36px;
     --ebk-synchronized-settings-list-device-icon-font-size: 18px;
     --ebk-category-separate-icon-font-size: 18px;
diff --git a/src/styles/mobile/font-size-x-large.css b/src/styles/mobile/font-size-x-large.css
index 52640e83..f1b8da10 100644
--- a/src/styles/mobile/font-size-x-large.css
+++ b/src/styles/mobile/font-size-x-large.css
@@ -73,6 +73,7 @@
     --ebk-trends-bar-chart-legend-icon-font-size: 20px;
     --ebk-trends-bar-chart-legend-text-font-size: 16px;
     --ebk-account-list-group-title-height: 38px;
+    --ebk-reconciliation-statement-list-group-title-height: 38px;
     --ebk-synchronized-settings-list-group-title-height: 38px;
     --ebk-synchronized-settings-list-device-icon-font-size: 21px;
     --ebk-category-separate-icon-font-size: 18px;
diff --git a/src/styles/mobile/font-size-xx-large.css b/src/styles/mobile/font-size-xx-large.css
index c524cfad..c3f01ef9 100644
--- a/src/styles/mobile/font-size-xx-large.css
+++ b/src/styles/mobile/font-size-xx-large.css
@@ -73,6 +73,7 @@
     --ebk-trends-bar-chart-legend-icon-font-size: 22px;
     --ebk-trends-bar-chart-legend-text-font-size: 18px;
     --ebk-account-list-group-title-height: 40px;
+    --ebk-reconciliation-statement-list-group-title-height: 40px;
     --ebk-synchronized-settings-list-group-title-height: 40px;
     --ebk-synchronized-settings-list-device-icon-font-size: 22px;
     --ebk-category-separate-icon-font-size: 20px;
diff --git a/src/styles/mobile/font-size-xxx-large.css b/src/styles/mobile/font-size-xxx-large.css
index 2299b336..30b54d9c 100644
--- a/src/styles/mobile/font-size-xxx-large.css
+++ b/src/styles/mobile/font-size-xxx-large.css
@@ -73,6 +73,7 @@
     --ebk-trends-bar-chart-legend-icon-font-size: 24px;
     --ebk-trends-bar-chart-legend-text-font-size: 20px;
     --ebk-account-list-group-title-height: 42px;
+    --ebk-reconciliation-statement-list-group-title-height: 42px;
     --ebk-synchronized-settings-list-group-title-height: 42px;
     --ebk-synchronized-settings-list-device-icon-font-size: 24px;
     --ebk-category-separate-icon-font-size: 20px;
diff --git a/src/styles/mobile/font-size-xxxx-large.css b/src/styles/mobile/font-size-xxxx-large.css
index a935c83f..f6674048 100644
--- a/src/styles/mobile/font-size-xxxx-large.css
+++ b/src/styles/mobile/font-size-xxxx-large.css
@@ -73,6 +73,7 @@
     --ebk-trends-bar-chart-legend-icon-font-size: 26px;
     --ebk-trends-bar-chart-legend-text-font-size: 22px;
     --ebk-account-list-group-title-height: 44px;
+    --ebk-reconciliation-statement-list-group-title-height: 44px;
     --ebk-synchronized-settings-list-group-title-height: 44px;
     --ebk-synchronized-settings-list-device-icon-font-size: 26px;
     --ebk-category-separate-icon-font-size: 22px;
diff --git a/src/views/mobile/accounts/ListPage.vue b/src/views/mobile/accounts/ListPage.vue
index aae38325..966b954d 100644
--- a/src/views/mobile/accounts/ListPage.vue
+++ b/src/views/mobile/accounts/ListPage.vue
@@ -145,7 +145,7 @@
                     </f7-swipeout-actions>
                     <f7-swipeout-actions right v-if="!sortable">
                         <f7-swipeout-button color="orange" close :text="tt('Edit')" @click="edit(account)"></f7-swipeout-button>
-                        <f7-swipeout-button color="deeporange" close :text="tt('More')" @click="showMoreActionSheetForAccount(account)"></f7-swipeout-button>
+                        <f7-swipeout-button color="primary" close :text="tt('More')" @click="showMoreActionSheetForAccount(account)"></f7-swipeout-button>
                         <f7-swipeout-button color="red" class="padding-left padding-right" @click="remove(account, false)">
                             <f7-icon f7="trash"></f7-icon>
                         </f7-swipeout-button>
diff --git a/src/views/mobile/accounts/ReconciliationStatementPage.vue b/src/views/mobile/accounts/ReconciliationStatementPage.vue
index 89ff33c8..475e2def 100644
--- a/src/views/mobile/accounts/ReconciliationStatementPage.vue
+++ b/src/views/mobile/accounts/ReconciliationStatementPage.vue
@@ -12,6 +12,9 @@
         </f7-navbar>
 
         <f7-list form strong inset dividers class="margin-vertical" v-if="!finishQuery">
+            <f7-list-item group-title>
+                <small>{{ tt('Date Range') }}</small>
+            </f7-list-item>
             <f7-list-item :key="dateRange.type"
                           :title="dateRange.displayName"
                           :disabled="!validQuery"
@@ -36,13 +39,8 @@
         </f7-list>
 
         <f7-list strong inset dividers class="margin-vertical" v-if="finishQuery && (startTime || endTime)">
-            <f7-list-item :title="tt('Start Date')" :after="displayStartDateTime"></f7-list-item>
-            <f7-list-item :title="tt('End Date')" :after="displayEndDateTime"></f7-list-item>
-        </f7-list>
-
-        <f7-list strong inset dividers class="margin-vertical skeleton-text" v-if="finishQuery && loading">
-            <f7-list-item :title="tt('Opening Balance')" after="Count"></f7-list-item>
-            <f7-list-item :title="tt('Closing Balance')" after="Count"></f7-list-item>
+            <f7-list-item :title="tt('Start Time')" :after="displayStartDateTime"></f7-list-item>
+            <f7-list-item :title="tt('End Time')" :after="displayEndDateTime"></f7-list-item>
         </f7-list>
 
         <f7-list strong inset dividers class="margin-vertical skeleton-text" v-if="finishQuery && loading">
@@ -52,11 +50,6 @@
             <f7-list-item :title="tt('Net Cash Flow')" after="Count"></f7-list-item>
         </f7-list>
 
-        <f7-list strong inset dividers class="margin-vertical" v-if="finishQuery && !loading">
-            <f7-list-item :title="tt('Opening Balance')" :after="displayOpeningBalance"></f7-list-item>
-            <f7-list-item :title="tt('Closing Balance')" :after="displayClosingBalance"></f7-list-item>
-        </f7-list>
-
         <f7-list strong inset dividers class="margin-vertical" v-if="finishQuery && !loading">
             <f7-list-item :title="tt('Total Transactions')" :after="reconciliationStatements.length || '0'"></f7-list-item>
             <f7-list-item :title="tt('Total Inflows')" :after="displayTotalInflows"></f7-list-item>
@@ -64,6 +57,16 @@
             <f7-list-item :title="tt('Net Cash Flow')" :after="displayTotalBalance"></f7-list-item>
         </f7-list>
 
+        <f7-list strong inset dividers class="margin-vertical skeleton-text" v-if="finishQuery && loading">
+            <f7-list-item :title="tt('Opening Balance')" after="Count"></f7-list-item>
+            <f7-list-item :title="tt('Closing Balance')" after="Count"></f7-list-item>
+        </f7-list>
+
+        <f7-list strong inset dividers class="margin-vertical" v-if="finishQuery && !loading">
+            <f7-list-item :title="tt('Opening Balance')" :after="displayOpeningBalance"></f7-list-item>
+            <f7-list-item :title="tt('Closing Balance')" :after="displayClosingBalance"></f7-list-item>
+        </f7-list>
+
         <f7-list strong inset dividers media-list
                  class="skeleton-text margin-vertical transaction-info-list reconciliation-statement-list"
                  v-if="finishQuery && loading">
@@ -463,6 +466,13 @@ init();
 }
 
 .list.reconciliation-statement-list li.reconciliation-statement-transaction-date {
+    display: flex;
+    align-items: center;
+    align-content: center;
+    padding-top: 0;
+    padding-bottom: 0;
+    height: var(--ebk-reconciliation-statement-list-group-title-height);
+    line-height: var(--ebk-reconciliation-statement-list-group-title-height);
     background-color: var(--f7-list-group-title-bg-color);
 }