enhance mobile header links (#3344)

* enhance mobile header links - change underlinedText style to use borderBottom - disable text selection * update vrt
actualbudget · Sep 5, 2024 · 8e6fb4c · 8e6fb4c
1 parent 5229fe7
commit 8e6fb4c
Show file tree

Hide file tree

Showing 19 changed files with 13 additions and 4 deletions.
diff --git a/...s-snapshots/Mobile-creates-a-transaction-via-footer-button-7-chromium-linux.png b/...s-snapshots/Mobile-creates-a-transaction-via-footer-button-7-chromium-linux.png
diff --git a/...s-snapshots/Mobile-creates-a-transaction-via-footer-button-8-chromium-linux.png b/...s-snapshots/Mobile-creates-a-transaction-via-footer-button-8-chromium-linux.png
diff --git a/...s-snapshots/Mobile-creates-a-transaction-via-footer-button-9-chromium-linux.png b/...s-snapshots/Mobile-creates-a-transaction-via-footer-button-9-chromium-linux.png
diff --git a/...apshots/Mobile-loads-the-budget-page-with-budgeted-amounts-1-chromium-linux.png b/...apshots/Mobile-loads-the-budget-page-with-budgeted-amounts-1-chromium-linux.png
diff --git a/...apshots/Mobile-loads-the-budget-page-with-budgeted-amounts-2-chromium-linux.png b/...apshots/Mobile-loads-the-budget-page-with-budgeted-amounts-2-chromium-linux.png
diff --git a/...apshots/Mobile-loads-the-budget-page-with-budgeted-amounts-3-chromium-linux.png b/...apshots/Mobile-loads-the-budget-page-with-budgeted-amounts-3-chromium-linux.png
diff --git a/...dividual-account-page-and-checks-that-filtering-is-working-1-chromium-linux.png b/...dividual-account-page-and-checks-that-filtering-is-working-1-chromium-linux.png
diff --git a/...dividual-account-page-and-checks-that-filtering-is-working-2-chromium-linux.png b/...dividual-account-page-and-checks-that-filtering-is-working-2-chromium-linux.png
diff --git a/...dividual-account-page-and-checks-that-filtering-is-working-3-chromium-linux.png b/...dividual-account-page-and-checks-that-filtering-is-working-3-chromium-linux.png
diff --git a/...dividual-account-page-and-checks-that-filtering-is-working-4-chromium-linux.png b/...dividual-account-page-and-checks-that-filtering-is-working-4-chromium-linux.png
diff --git a/...dividual-account-page-and-checks-that-filtering-is-working-5-chromium-linux.png b/...dividual-account-page-and-checks-that-filtering-is-working-5-chromium-linux.png
diff --git a/...dividual-account-page-and-checks-that-filtering-is-working-6-chromium-linux.png b/...dividual-account-page-and-checks-that-filtering-is-working-6-chromium-linux.png
diff --git a/...dividual-account-page-and-checks-that-filtering-is-working-7-chromium-linux.png b/...dividual-account-page-and-checks-that-filtering-is-working-7-chromium-linux.png
diff --git a/...dividual-account-page-and-checks-that-filtering-is-working-8-chromium-linux.png b/...dividual-account-page-and-checks-that-filtering-is-working-8-chromium-linux.png
diff --git a/...dividual-account-page-and-checks-that-filtering-is-working-9-chromium-linux.png b/...dividual-account-page-and-checks-that-filtering-is-working-9-chromium-linux.png
diff --git a/packages/desktop-client/src/components/mobile/accounts/AccountTransactions.jsx b/packages/desktop-client/src/components/mobile/accounts/AccountTransactions.jsx
@@ -127,7 +127,11 @@ function AccountName({ account, pending, failed }) {
         />
       )}
       <Text
-        style={{ ...styles.underlinedText, ...styles.lineClamp(2) }}
+        style={{
+          userSelect: 'none',
+          ...styles.underlinedText,
+          ...styles.lineClamp(2),
+        }}
         onClick={onClick}
       >
         {`${account.closed ? 'Closed: ' : ''}${account.name}`}

diff --git a/packages/desktop-client/src/components/mobile/budget/BudgetTable.jsx b/packages/desktop-client/src/components/mobile/budget/BudgetTable.jsx
@@ -1998,6 +1998,7 @@ function MonthSelector({
           fontSize: 16,
           fontWeight: 500,
           margin: '0 5px',
+          userSelect: 'none',
           ...styles.underlinedText,
         }}
         onPointerUp={e => {

diff --git a/packages/desktop-client/src/style/styles.ts b/packages/desktop-client/src/style/styles.ts
@@ -110,9 +110,7 @@ export const styles = {
     animationDelay: '0.5s',
   },
   underlinedText: {
-    textDecoration: 'underline',
-    textDecorationThickness: 2,
-    textDecorationColor: theme.pillBorder,
+    borderBottom: `2px solid`,
   },
   noTapHighlight: {
     WebkitTapHighlightColor: 'transparent',

diff --git a/upcoming-release-notes/3344.md b/upcoming-release-notes/3344.md
@@ -0,0 +1,6 @@
+---
+category: Enhancements
+authors: [tim-smart]
+---
+
+Adjust mobile header link style