🐞 Fix mobile transactions colors - fixes #7042 (#7047)

* Update amount styling with theme colors

* Clean up imports in TransactionListItem.tsx

Removed unused import of makeBalanceAmountStyle.

* Add release notes for bugfix in color variables

Fix color variables for mobile transaction list items.

* Change positiveColor in amount to use theme.tableText

* Change negative color style for running balance

* Fix negative color style in TransactionListItem

* Update color styles for transaction amount display

* Update upcoming-release-notes/7047.md

Co-authored-by: Matt Fiddaman <github@m.fiddaman.uk>

* Update VRT screenshots

Auto-generated by VRT workflow

PR: #7047

---------

Co-authored-by: Matt Fiddaman <github@m.fiddaman.uk>
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

packages/desktop-client/src/components/mobile/transactions/TransactionListItem.tsx

@@ -34,10 +34,7 @@ import type { AccountEntity, TransactionEntity } from 'loot-core/types/models';
 
 import { lookupName, Status } from './TransactionEdit';
 
-import {
+import { makeAmountFullStyle } from '@desktop-client/components/budget/util';
-  makeAmountFullStyle,
-  makeBalanceAmountStyle,
-} from '@desktop-client/components/budget/util';
 import { useAccount } from '@desktop-client/hooks/useAccount';
 import { useCachedSchedules } from '@desktop-client/hooks/useCachedSchedules';
 import { useCategories } from '@desktop-client/hooks/useCategories';
@@ -283,7 +280,11 @@ export function TransactionListItem({
             <Text
               style={{
                 ...styles.tnum,
-                ...makeAmountFullStyle(amount),
+                ...makeAmountFullStyle(amount, {
+                  positiveColor: theme.tableText,
+                  negativeColor: theme.tableText,
+                  zeroColor: theme.numberNeutral,
+                }),
                 ...textStyle,
               }}
             >
@@ -295,7 +296,11 @@ export function TransactionListItem({
                   fontSize: 11,
                   fontWeight: '400',
                   ...styles.tnum,
-                  ...makeBalanceAmountStyle(runningBalance),
+                  ...makeAmountFullStyle(runningBalance, {
+                    positiveColor: theme.numberPositive,
+                    negativeColor: theme.numberNegative,
+                    zeroColor: theme.numberNeutral,
+                  }),
                 }}
               >
                 {integerToCurrency(runningBalance)}

upcoming-release-notes/7047.md

@@ -0,0 +1,6 @@
+---
+category: Bugfixes
+authors: [Juulz]
+---
+
+Make mobile account page colors more consistent