diff --git a/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-from-accounts-id-page-1-chromium-linux.png b/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-from-accounts-id-page-1-chromium-linux.png
index ce13427af8795856513e8632eae1a58bbaf84b51..7ab4ea91bb83824177a6e8e47bd1e88a22d4c582 100644
Binary files a/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-from-accounts-id-page-1-chromium-linux.png and b/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-from-accounts-id-page-1-chromium-linux.png differ
diff --git a/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-from-accounts-id-page-2-chromium-linux.png b/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-from-accounts-id-page-2-chromium-linux.png
index 4b22f0e2f6e3adb5c0540b60bacb0671b6f6234f..620d3a5eeccc84c862218806d4c7291ec804bd67 100644
Binary files a/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-from-accounts-id-page-2-chromium-linux.png and b/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-from-accounts-id-page-2-chromium-linux.png differ
diff --git a/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-1-chromium-linux.png b/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-1-chromium-linux.png
index 85905bc0ee1f8c18b55c53d7593a2d689f1d611b..9e4d97f3c4e2048aa3cd6b59deaf6791976e18e1 100644
Binary files a/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-1-chromium-linux.png and b/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-1-chromium-linux.png differ
diff --git a/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-2-chromium-linux.png b/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-2-chromium-linux.png
index efc32336eed6f6bad4ba415c8afe1432f6d9a628..1241e32dd94a3a6f402c99ad0e3ef68411327c82 100644
Binary files a/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-2-chromium-linux.png and b/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-2-chromium-linux.png differ
diff --git a/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-3-chromium-linux.png b/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-3-chromium-linux.png
index 42cb054ab58c74803ee0ac0725c0239056e3ec0c..345c5eb9c58de3c178ee90f00099b11069adbca1 100644
Binary files a/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-3-chromium-linux.png and b/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-3-chromium-linux.png differ
diff --git a/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-4-chromium-linux.png b/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-4-chromium-linux.png
index 034509229c4b9a828780a71321629b83f118e725..9ac1868fcaed857d5701c072553b848a0dc33b2b 100644
Binary files a/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-4-chromium-linux.png and b/packages/desktop-client/e2e/mobile.test.js-snapshots/Mobile-creates-a-transaction-via-footer-button-4-chromium-linux.png differ
diff --git a/packages/desktop-client/src/components/budget/util.ts b/packages/desktop-client/src/components/budget/util.ts
index 733012c5496b9f291a80e225f6779fe46ae523a9..14b389518a02fa8d7520cf9b1ba31930d374faca 100644
--- a/packages/desktop-client/src/components/budget/util.ts
+++ b/packages/desktop-client/src/components/budget/util.ts
@@ -75,9 +75,9 @@ export function makeAmountFullStyle(
zeroColor?: string;
},
) {
- const positiveColorToUse = colors.positiveColor || theme.noticeText;
- const negativeColorToUse = colors.negativeColor || theme.errorText;
- const zeroColorToUse = colors.zeroColor || theme.tableTextSubdued;
+ const positiveColorToUse = colors?.positiveColor || theme.noticeText;
+ const negativeColorToUse = colors?.negativeColor || theme.errorText;
+ const zeroColorToUse = colors?.zeroColor || theme.tableTextSubdued;
return {
color:
value < 0
diff --git a/packages/desktop-client/src/components/mobile/transactions/FocusableAmountInput.tsx b/packages/desktop-client/src/components/mobile/transactions/FocusableAmountInput.tsx
index 17b0d0d3281d6efc488ef3b99099d75f2147707c..6f3c66845e8137b8e5d2754085b2ad80c75ab95d 100644
--- a/packages/desktop-client/src/components/mobile/transactions/FocusableAmountInput.tsx
+++ b/packages/desktop-client/src/components/mobile/transactions/FocusableAmountInput.tsx
@@ -17,6 +17,7 @@ import {
import { useLocalPref } from '../../../hooks/useLocalPref';
import { useMergedRefs } from '../../../hooks/useMergedRefs';
import { type CSSProperties, theme } from '../../../style';
+import { makeAmountFullStyle } from '../../budget/util';
import { Button } from '../../common/Button';
import { Text } from '../../common/Text';
import { View } from '../../common/View';
@@ -230,6 +231,9 @@ export const FocusableAmountInput = memo(function FocusableAmountInput({
onUpdateAmount={amount => onUpdateAmount(amount, isNegative)}
focused={focused && !disabled}
style={{
+ ...makeAmountFullStyle(value, {
+ zeroColor: isNegative ? theme.errorText : theme.noticeText,
+ }),
width: 80,
justifyContent: 'center',
...style,
@@ -276,7 +280,14 @@ export const FocusableAmountInput = memo(function FocusableAmountInput({
...style,
}}
>
- <Text style={{ fontSize: 15, userSelect: 'none', ...textStyle }}>
+ <Text
+ style={{
+ ...makeAmountFullStyle(value),
+ fontSize: 15,
+ userSelect: 'none',
+ ...textStyle,
+ }}
+ >
{amountToCurrency(Math.abs(value))}
</Text>
</View>
diff --git a/upcoming-release-notes/2628.md b/upcoming-release-notes/2628.md
new file mode 100644
index 0000000000000000000000000000000000000000..cd065d75218d61078abd53b668e63135078ea826
--- /dev/null
+++ b/upcoming-release-notes/2628.md
@@ -0,0 +1,6 @@
+---
+category: Enhancements
+authors: [joel-jeremy]
+---
+
+Add negative/positive colors to mobile transaction amount input