From b708d4914fda5d035cebb32ee22071e620155818 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Qu=E1=BB=91c=20Kh=C3=A1nh?= Date: Wed, 14 Aug 2024 22:07:44 +0700 Subject: [PATCH] fix(mobile): fix header font to Inter --- apps/mobile/app/(app)/(tabs)/_layout.tsx | 4 ++-- apps/mobile/app/(app)/_layout.tsx | 2 +- apps/mobile/app/(aux)/_layout.tsx | 2 +- apps/mobile/app/_layout.tsx | 2 ++ .../components/budget/budget-statistic.tsx | 17 +++-------------- apps/mobile/components/common/amount-format.tsx | 6 +++--- apps/mobile/components/common/toast.tsx | 2 +- .../components/numeric-pad/numeric-pad.tsx | 2 +- .../components/text-ticker/text-ticker.tsx | 7 +++++-- .../components/transaction/transaction-form.tsx | 4 ++-- 10 files changed, 21 insertions(+), 27 deletions(-) diff --git a/apps/mobile/app/(app)/(tabs)/_layout.tsx b/apps/mobile/app/(app)/(tabs)/_layout.tsx index 5de23c41..7af4029b 100644 --- a/apps/mobile/app/(app)/(tabs)/_layout.tsx +++ b/apps/mobile/app/(app)/(tabs)/_layout.tsx @@ -44,7 +44,7 @@ export default function TabLayout() { backgroundColor: theme[colorScheme ?? 'light'].background, }, headerTitleStyle: { - fontFamily: 'Be Vietnam Pro Medium', + fontFamily: 'Inter Medium', fontSize: 16, color: theme[colorScheme ?? 'light'].primary, }, @@ -66,7 +66,7 @@ export default function TabLayout() { options={{ headerTitle: t(i18n)`Budgets`, headerTitleStyle: { - fontFamily: 'Be Vietnam Pro Medium', + fontFamily: 'Inter Medium', fontSize: 16, color: theme[colorScheme ?? 'light'].primary, marginLeft: 5, diff --git a/apps/mobile/app/(app)/_layout.tsx b/apps/mobile/app/(app)/_layout.tsx index 14866a8c..cf4a46bc 100644 --- a/apps/mobile/app/(app)/_layout.tsx +++ b/apps/mobile/app/(app)/_layout.tsx @@ -32,7 +32,7 @@ export default function AuthenticatedLayout() { headerTintColor: theme[colorScheme ?? 'light'].primary, headerShadowVisible: false, headerTitleStyle: { - fontFamily: 'Be Vietnam Pro Medium', + fontFamily: 'Inter Medium', fontSize: 16, color: theme[colorScheme ?? 'light'].primary, }, diff --git a/apps/mobile/app/(aux)/_layout.tsx b/apps/mobile/app/(aux)/_layout.tsx index 6e0024d1..134e599b 100644 --- a/apps/mobile/app/(aux)/_layout.tsx +++ b/apps/mobile/app/(aux)/_layout.tsx @@ -16,7 +16,7 @@ export default function AuxiliaryLayout() { headerTintColor: theme[colorScheme ?? 'light'].primary, headerShadowVisible: false, headerTitleStyle: { - fontFamily: 'Be Vietnam Pro Medium', + fontFamily: 'Inter Medium', fontSize: 16, color: theme[colorScheme ?? 'light'].primary, }, diff --git a/apps/mobile/app/_layout.tsx b/apps/mobile/app/_layout.tsx index bb0eba56..1c9d89c9 100644 --- a/apps/mobile/app/_layout.tsx +++ b/apps/mobile/app/_layout.tsx @@ -15,6 +15,7 @@ import { Inter_300Light, Inter_400Regular, Inter_500Medium, + Inter_600SemiBold, useFonts, } from '@expo-google-fonts/inter' import { @@ -115,6 +116,7 @@ function RootLayout() { Inter_300Light, Inter_400Regular, Inter_500Medium, + Inter_600SemiBold, }) const ref = useNavigationContainerRef() diff --git a/apps/mobile/components/budget/budget-statistic.tsx b/apps/mobile/components/budget/budget-statistic.tsx index 45c3ae5a..daf2aae9 100644 --- a/apps/mobile/components/budget/budget-statistic.tsx +++ b/apps/mobile/components/budget/budget-statistic.tsx @@ -1,7 +1,7 @@ -import { useDefaultCurrency } from '@/stores/user-settings/hooks' import { t } from '@lingui/macro' import { useLingui } from '@lingui/react' import { View } from 'react-native' +import { AmountFormat } from '../common/amount-format' import { Text } from '../ui/text' type BudgetStatisticProps = { @@ -14,28 +14,17 @@ export function BudgetStatistic({ remainingPerDay, }: BudgetStatisticProps) { const { i18n } = useLingui() - const defaultCurrency = useDefaultCurrency() return ( - - {totalRemaining?.toLocaleString() || '0.00'}{' '} - - {defaultCurrency} - - + {t(i18n)`Left this month`} - - {remainingPerDay?.toLocaleString() || '0.00'}{' '} - - {defaultCurrency} - - + {t(i18n)`Left per day`} diff --git a/apps/mobile/components/common/amount-format.tsx b/apps/mobile/components/common/amount-format.tsx index c190ee62..2ff90e99 100644 --- a/apps/mobile/components/common/amount-format.tsx +++ b/apps/mobile/components/common/amount-format.tsx @@ -4,13 +4,13 @@ import { type VariantProps, cva } from 'class-variance-authority' import { useMemo } from 'react' import { Text } from '../ui/text' -const amountVariants = cva('shrink-0 font-bold', { +const amountVariants = cva('shrink-0 font-semibold', { variants: { size: { xl: 'text-4xl', lg: 'text-3xl', md: 'text-2xl', - sm: 'text-lg', + sm: 'text-base', }, }, defaultVariants: { @@ -18,7 +18,7 @@ const amountVariants = cva('shrink-0 font-bold', { }, }) -const currencyVariants = cva('text-muted-foreground', { +const currencyVariants = cva('font-medium text-muted-foreground', { variants: { size: { xl: 'text-base', diff --git a/apps/mobile/components/common/toast.tsx b/apps/mobile/components/common/toast.tsx index 5dc6e7ae..6c0a5709 100644 --- a/apps/mobile/components/common/toast.tsx +++ b/apps/mobile/components/common/toast.tsx @@ -6,7 +6,7 @@ export function ToastRoot() { extraInsets={{ top: -12 }} defaultStyle={{ text: { - fontFamily: 'Be Vietnam Pro Medium', + fontFamily: 'Inter Medium', }, }} /> diff --git a/apps/mobile/components/numeric-pad/numeric-pad.tsx b/apps/mobile/components/numeric-pad/numeric-pad.tsx index bb19d347..31ed8906 100644 --- a/apps/mobile/components/numeric-pad/numeric-pad.tsx +++ b/apps/mobile/components/numeric-pad/numeric-pad.tsx @@ -70,7 +70,7 @@ export function NumericPad({ size="lg" onPressIn={Haptics.selectionAsync} > - {buttonKey} + {buttonKey} ))} diff --git a/apps/mobile/components/text-ticker/text-ticker.tsx b/apps/mobile/components/text-ticker/text-ticker.tsx index 78227e22..f1a6522f 100644 --- a/apps/mobile/components/text-ticker/text-ticker.tsx +++ b/apps/mobile/components/text-ticker/text-ticker.tsx @@ -105,7 +105,7 @@ export function TextTicker({ > {formattedNumber.value} @@ -120,7 +120,10 @@ export function TextTicker({ {suffix} diff --git a/apps/mobile/components/transaction/transaction-form.tsx b/apps/mobile/components/transaction/transaction-form.tsx index c521697c..6eb4a4bf 100644 --- a/apps/mobile/components/transaction/transaction-form.tsx +++ b/apps/mobile/components/transaction/transaction-form.tsx @@ -54,9 +54,9 @@ function TransactionAmount() { <> { Haptics.selectionAsync() sheetRef.current?.present()