frontend: introduce a new text wrapper component
Parents:
6a5c37121 file(s) changed
- frontend/app/(tabs)/actions.tsx +2 -2
- frontend/app/(tabs)/insights.tsx +1 -2
- frontend/app/(tabs)/new/entry.tsx +8 -8
- frontend/app/(tabs)/new/index.tsx +5 -5
- frontend/app/entry/post-mood-links.tsx +2 -1
- frontend/app/modal.tsx +13 -3
- frontend/app/profile.tsx +1 -2
- frontend/components/history/MoodHistoryCard.tsx +2 -1
- frontend/components/history/SleepRecordCard.tsx +2 -1
- frontend/components/insights/EnergySleepWidget.tsx +2 -2
- frontend/components/misc/themed-text.tsx +0 -60
- frontend/components/ui/Cards.tsx +1 -2
- frontend/components/ui/MoodComponentCard.tsx +2 -1
- frontend/components/ui/MoodEntryLog.tsx +2 -1
- frontend/components/ui/ScreenLayout.tsx +2 -2
- frontend/components/ui/Sections.tsx +9 -9
- frontend/components/ui/Text.tsx +10 -0
- frontend/components/ui/Toast.tsx +2 -1
- frontend/components/ui/collapsible.tsx +2 -2
- frontend/components/ui/index.ts +1 -0
- frontend/constants/theme.ts +14 -42
frontend/app/(tabs)/actions.tsx
1 -
import { View, Text, StyleSheet } from "react-native";
2 -
import { ThemedText } from "@/components/misc/themed-text";
1 +
import { View, StyleSheet } from "react-native";
2 +
import { Text } from "@/components/ui/Text";
3 3
import { ThemedView } from "@/components/misc/themed-view";
4 4
import { ScreenLayout } from "@/components/ui/ScreenLayout";
5 5
import { useAuth } from "@/context/AuthContext";
6 6
import { Section, SectionHeader } from "@/components/ui/Sections";
7 7
import { Card, SubtleInfoCard } from "@/components/ui/Cards";
▸ 164 unchanged lines
172 172
fontSize: 12,
173 173
lineHeight: 16,
174 174
alignItems: "center",
175 175
},
176 176
});
frontend/app/(tabs)/insights.tsx
1 -
import { View, Text, ScrollView, StyleSheet } from "react-native";
1 +
import { View, ScrollView, StyleSheet } from "react-native";
2 2
3 -
import { ThemedText } from "@/components/misc/themed-text";
4 3
import { ThemedView } from "@/components/misc/themed-view";
5 4
import { ScreenLayout } from "@/components/ui/ScreenLayout";
6 5
import { useAuth } from "@/context/AuthContext";
7 6
import { Card } from "@/components/ui/Cards";
8 7
import { Section, SectionHeader } from "@/components/ui/Sections";
▸ 122 unchanged lines
131 130
insightMetric: {
132 131
...Typography.headlineLg,
133 132
fontSize: 22,
134 133
},
135 134
});
frontend/app/(tabs)/new/entry.tsx
1 1
import { useState, useEffect } from "react";
2 2
import { Link, router, useLocalSearchParams } from "expo-router";
3 3
4 -
import { View, Text, StyleSheet, ScrollView } from "react-native";
4 +
import { View, StyleSheet, ScrollView } from "react-native";
5 5
6 +
import { Text } from "@/components/ui/Text";
6 7
import { SafeAreaView } from "react-native-safe-area-context";
7 -
import { ThemedText } from "@/components/misc/themed-text";
8 8
import { ThemedView } from "@/components/misc/themed-view";
9 9
import { ScreenLayout } from "@/components/ui/ScreenLayout";
10 10
import { useAuth } from "@/context/AuthContext";
11 11
import { Grid, Col, Row, Between, Center } from "@/components/ui/LayoutHelpers";
12 12
import { Card } from "@/components/ui/Cards";
▸ 74 unchanged lines
87 87
return (
88 88
<View>
89 89
<ScrollView scrollEventThrottle={16}>
90 90
<View style={styles.container}>
91 91
<Center>
92 -
<ThemedText style={styles.statusPrefix}>
92 +
<Text style={styles.statusPrefix}>
93 93
Como você está se sentindo agora?
94 -
</ThemedText>
94 +
</Text>
95 95
96 -
<ThemedText style={styles.statusText}>
96 +
<Text style={styles.statusText}>
97 97
{selectedMood?.label || "Neutro"}
98 -
</ThemedText>
98 +
</Text>
99 99
</Center>
100 100
101 101
<Card style={styles.resumeCard}>
102 -
<ThemedText style={styles.infoText}>
102 +
<Text style={styles.infoText}>
103 103
Não existe resposta certa ou errada. Estime, de 0 a 10, como tu
104 104
percebe tua energia, estresse e ansiedade neste momento. O
105 105
objetivo é registrar uma impressão geral, não uma medida precisa.
106 -
</ThemedText>
106 +
</Text>
107 107
108 108
<Col gap={24}>
109 109
<ScaleSlider
110 110
variant="rich"
111 111
label="Energia"
▸ 97 unchanged lines
209 209
},
210 210
resumeCard: {
211 211
padding: Spacing.cardGap,
212 212
},
213 213
});
frontend/app/(tabs)/new/index.tsx
1 1
import { useEffect, useState } from "react";
2 -
import { StyleSheet, View, Text, ActivityIndicator } from "react-native";
2 +
import { StyleSheet, View, ActivityIndicator } from "react-native";
3 3
4 -
import { ThemedText } from "@/components/misc/themed-text";
4 +
import { Text } from "@/components/ui/Text";
5 5
import { ThemedView } from "@/components/misc/themed-view";
6 6
import { ScreenLayout } from "@/components/ui/ScreenLayout";
7 7
import { useAuth } from "@/context/AuthContext";
8 8
import { Grid, Col, Row, Between } from "@/components/ui/LayoutHelpers";
9 9
import { Card } from "@/components/ui/Cards";
▸ 45 unchanged lines
55 55
></SectionHeader>
56 56
57 57
<Card style={{ minHeight: 200 }}>
58 58
<Col gap={16}>
59 59
<Between style={styles.quickRegisterHeader}>
60 -
<ThemedText style={styles.quickRegisterTitle}>
60 +
<Text style={styles.quickRegisterTitle}>
61 61
Registro rápido
62 -
</ThemedText>
62 +
</Text>
63 63
64 -
<ThemedText style={styles.quickRegisterBadge}>HOJE</ThemedText>
64 +
<Text style={styles.quickRegisterBadge}>HOJE</Text>
65 65
</Between>
66 66
67 67
<MoodSelector
68 68
style={{ paddingLeft: 8, paddingRight: 8, paddingTop: 16 }}
69 69
items={MOODS}
▸ 91 unchanged lines
161 161
fontSize: 11,
162 162
fontWeight: 600,
163 163
lineHeight: 16.5,
164 164
},
165 165
});
frontend/app/entry/post-mood-links.tsx
1 -
import { View, Text, TouchableOpacity, ScrollView, StyleSheet, ActivityIndicator } from 'react-native';
1 +
import { View, TouchableOpacity, ScrollView, StyleSheet, ActivityIndicator } from 'react-native';
2 +
import { Text } from '@/components/ui/Text';
2 3
import { useState } from 'react';
3 4
import { router, useLocalSearchParams } from 'expo-router';
4 5
import { Ionicons, MaterialIcons } from '@expo/vector-icons';
5 6
import { Button } from '@/components/ui/Button';
6 7
import { Section, SectionHeader } from '@/components/ui/Sections';
▸ 187 unchanged lines
194 195
backgroundColor: Colors.light.tint + '1A',
195 196
},
196 197
impactLabel: { fontSize: 18, fontWeight: '600', color: Colors.light.textSecondary },
197 198
impactLabelActive: { color: Colors.light.text },
198 199
});
frontend/app/modal.tsx
1 1
import { Link } from 'expo-router';
2 2
import { StyleSheet } from 'react-native';
3 3
4 -
import { ThemedText } from '@/components/misc/themed-text';
4 +
import { Text } from '@/components/ui/Text';
5 5
import { ThemedView } from '@/components/misc/themed-view';
6 6
7 7
export default function ModalScreen() {
8 8
return (
9 9
<ThemedView style={styles.container}>
10 -
<ThemedText type="title">This is a modal</ThemedText>
10 +
<Text style={styles.title}>This is a modal</Text>
11 11
<Link href="/" dismissTo style={styles.link}>
12 -
<ThemedText type="link">Go to home screen</ThemedText>
12 +
<Text style={styles.linkText}>Go to home screen</Text>
13 13
</Link>
14 14
</ThemedView>
15 15
);
16 16
}
17 17
▸ 5 unchanged lines
23 23
padding: 20,
24 24
},
25 25
link: {
26 26
marginTop: 15,
27 27
paddingVertical: 15,
28 +
},
29 +
title: {
30 +
fontSize: 32,
31 +
fontWeight: 'bold',
32 +
lineHeight: 32,
33 +
},
34 +
linkText: {
35 +
lineHeight: 30,
36 +
fontSize: 16,
37 +
color: '#0a7ea4',
28 38
},
29 39
});
frontend/app/profile.tsx
1 1
import { useState, useEffect } from 'react';
2 2
import {
3 3
View,
4 -
Text,
5 4
StyleSheet,
6 5
ScrollView,
7 6
KeyboardAvoidingView,
8 7
} from 'react-native';
9 8
9 +
import { Text } from '@/components/ui/Text';
10 10
import { ThemedView } from '@/components/ui/themed-view'
11 -
import { ThemedText } from '@/components/ui/themed-text'
12 11
import { Link, useLocalSearchParams, router } from 'expo-router';
13 12
import { StatusBar } from 'expo-status-bar';
14 13
import { SafeAreaView } from 'react-native-safe-area-context';
15 14
import { useThemeColor } from '@/hooks/use-theme-color';
16 15
import { Button, Input } from '@/components/ui';
▸ 256 unchanged lines
273 272
cardBlockHint: {
274 273
...Typography.cardHint,
275 274
color: Colors.light.textSecondary
276 275
}
277 276
});
frontend/components/history/MoodHistoryCard.tsx
1 1
// components/history/cards/MoodHistoryCard.tsx
2 -
import { View, Text, StyleSheet } from 'react-native';
2 +
import { View, StyleSheet } from 'react-native';
3 +
import { Text } from '@/components/ui/Text';
3 4
import { MaterialIcons } from '@expo/vector-icons';
4 5
import { Card } from '@/components/ui/Cards';
5 6
import { Badge } from '@/components/ui/Badge';
6 7
import type { HistoryCard } from '@/lib/history/types';
7 8
import type { MoodEntry } from '@/lib/api';
▸ 99 unchanged lines
107 108
alignSelf: 'flex-start',
108 109
marginTop: 4,
109 110
maxWidth: '50%'
110 111
}
111 112
})
frontend/components/history/SleepRecordCard.tsx
1 -
import { View, Text, StyleSheet } from 'react-native'
1 +
import { View, StyleSheet } from 'react-native'
2 +
import { Text } from '@/components/ui/Text'
2 3
import { MaterialIcons } from '@expo/vector-icons'
3 4
import { Card } from '@/components/ui/Cards'
4 5
import { Badge } from '@/components/ui/Badge'
5 6
import type { SleepRecord } from '@/lib/api'
6 7
import { Spacing } from '@/constants/theme';
▸ 106 unchanged lines
113 114
alignSelf: 'flex-start',
114 115
marginTop: 4,
115 116
maxWidth: '50%'
116 117
},
117 118
})
frontend/components/insights/EnergySleepWidget.tsx
1 1
import React from "react";
2 -
import { Text, StyleSheet, ActivityIndicator } from "react-native";
2 +
import { StyleSheet, ActivityIndicator } from "react-native";
3 +
import { Text } from "@/components/ui/Text";
3 4
import { Card } from "@/components/ui/Cards";
4 -
import { ThemedText } from "@/components/misc/themed-text";
5 5
import { useInsight } from "@/hooks/useInsights.queries";
6 6
import { Spacing, Typography, Colors } from "@/constants/theme";
7 7
import { InsightCard, MetricAccent } from "./InsightCard";
8 8
9 9
export const EnergySleepWidget: React.FC = () => {
▸ 65 unchanged lines
75 75
empty: {
76 76
color: Colors.light.lightSlateGray,
77 77
marginTop: 4,
78 78
},
79 79
});
@@ -1,60 +0,0 @@
1 - import { StyleSheet, Text, type TextProps } from 'react-native';
2 -
3 - import { useThemeColor } from '@/hooks/use-theme-color';
4 -
5 - export type ThemedTextProps = TextProps & {
6 - lightColor?: string;
7 - darkColor?: string;
8 - type?: 'default' | 'title' | 'defaultSemiBold' | 'subtitle' | 'link';
9 - };
10 -
11 - export function ThemedText({
12 - style,
13 - lightColor,
14 - darkColor,
15 - type = 'default',
16 - ...rest
17 - }: ThemedTextProps) {
18 - const color = useThemeColor({ light: lightColor, dark: darkColor }, 'text');
19 -
20 - return (
21 - <Text
22 - style={[
23 - { color },
24 - type === 'default' ? styles.default : undefined,
25 - type === 'title' ? styles.title : undefined,
26 - type === 'defaultSemiBold' ? styles.defaultSemiBold : undefined,
27 - type === 'subtitle' ? styles.subtitle : undefined,
28 - type === 'link' ? styles.link : undefined,
29 - style,
30 - ]}
31 - {...rest}
32 - />
33 - );
34 - }
35 -
36 - const styles = StyleSheet.create({
37 - default: {
38 - fontSize: 16,
39 - lineHeight: 24,
40 - },
41 - defaultSemiBold: {
42 - fontSize: 16,
43 - lineHeight: 24,
44 - fontWeight: '600',
45 - },
46 - title: {
47 - fontSize: 32,
48 - fontWeight: 'bold',
49 - lineHeight: 32,
50 - },
51 - subtitle: {
52 - fontSize: 20,
53 - fontWeight: 'bold',
54 - },
55 - link: {
56 - lineHeight: 30,
57 - fontSize: 16,
58 - color: '#0a7ea4',
59 - },
60 - });
frontend/components/ui/Cards.tsx
1 1
import React from 'react';
2 2
import {
3 3
View,
4 4
StyleSheet,
5 5
Pressable,
6 6
ViewStyle,
7 -
Text
8 7
} from 'react-native';
9 8
10 9
import { Colors, Typography, Spacing, BorderRadius, Shadows } from '@/constants/theme';
11 10
import { useThemeColor } from '@/hooks/use-theme-color';
12 -
import { ThemedText } from '@/components/misc/themed-text'
11 +
import { Text } from '@/components/ui/Text'
13 12
import { Ionicons } from '@expo/vector-icons';
14 13
15 14
interface CardProps {
16 15
children: React.ReactNode;
17 16
onPress?: () => void;
▸ 83 unchanged lines
101 100
{text.replace(/\s+/g, ' ').trim()}
102 101
</Text>
103 102
</View>
104 103
)
105 104
}
frontend/components/ui/MoodComponentCard.tsx
1 1
import React from 'react';
2 -
import { View, Text, StyleSheet, ViewStyle } from 'react-native';
2 +
import { View, StyleSheet, ViewStyle } from 'react-native';
3 +
import { Text } from '@/components/ui/Text';
3 4
import { Row } from '@/components/ui/LayoutHelpers';
4 5
import { Card } from '@/components/ui/Cards';
5 6
import { getMoodComponent, intensityLabel } from '@/constants/mood-components';
6 7
import { Theme } from '@/constants/theme';
7 8
▸ 63 unchanged lines
71 72
color: Theme.colors.light.moodIntensityLabel,
72 73
flexShrink: 1,
73 74
height: '100%',
74 75
},
75 76
});
frontend/components/ui/MoodEntryLog.tsx
1 1
import { format, isToday, isYesterday } from 'date-fns';
2 2
import { ptBR } from 'date-fns/locale';
3 -
import { StyleSheet, Text, View } from 'react-native';
3 +
import { StyleSheet, View } from 'react-native';
4 +
import { Text } from '@/components/ui/Text';
4 5
import { router } from 'expo-router';
5 6
6 7
import { Card } from '@/components/ui/Cards';
7 8
import { Badge } from '@/components/ui/Badge';
8 9
import { getMood } from '@/constants/moods';
▸ 73 unchanged lines
82 83
letterSpacing: 0.1,
83 84
},
84 85
});
85 86
86 87
export default MoodEntryLog
frontend/components/ui/ScreenLayout.tsx
1 1
import React from "react";
2 2
3 3
import {
4 4
View,
5 5
ScrollView,
▸ 6 unchanged lines
12 12
import { SafeAreaView } from "react-native-safe-area-context";
13 13
import { useRouter } from "expo-router";
14 14
import { IconSymbol } from "@/components/ui/icon-symbol";
15 15
import { useThemeColor } from "@/hooks/use-theme-color";
16 16
import { Typography, Spacing, BorderRadius } from "@/constants/theme";
17 -
import { ThemedText } from "@/components/misc/themed-text";
17 +
import { Text } from "@/components/ui/Text";
18 18
19 19
interface ScreenLayoutProps {
20 20
children: React.ReactNode;
21 21
userName?: string;
22 22
userAvatar?: string;
▸ 89 unchanged lines
112 112
<Image source={{ uri: userAvatar }} style={styles.avatar} />
113 113
) : (
114 114
<View style={styles.avatar} />
115 115
)}
116 116
<View>
117 -
<ThemedText style={styles.userName}>Olá, {userName}</ThemedText>
117 +
<Text style={styles.userName}>Olá, {userName}</Text>
118 118
</View>
119 119
</View>
120 120
121 121
<Pressable
122 122
style={styles.notificationButton}
▸ 24 unchanged lines
147 147
</View>
148 148
);
149 149
};
150 150
151 151
export default ScreenLayout;
frontend/components/ui/Sections.tsx
1 1
import React from 'react';
2 2
import {
3 3
View,
4 4
StyleSheet,
5 5
Pressable,
6 6
ViewStyle,
7 7
} from 'react-native';
8 -
import { ThemedText } from '@/components/misc/themed-text'
8 +
import { Text } from '@/components/ui/Text'
9 9
import { Row, Between } from '@/components/ui/LayoutHelpers';
10 10
11 11
import { Colors, Typography, Spacing, BorderRadius } from '@/constants/theme';
12 12
import { useThemeColor } from '@/hooks/use-theme-color';
13 13
▸ 88 unchanged lines
102 102
103 103
// TODO: Rework these when we finally have chips/badges
104 104
return (
105 105
<View style={[styles.headerContainer, style]}>
106 106
<Between>
107 -
<ThemedText style={styles.title}>
107 +
<Text style={styles.title}>
108 108
{title}
109 -
</ThemedText>
109 +
</Text>
110 110
111 111
{info && !actionLabel && (
112 -
<ThemedText>
112 +
<Text>
113 113
{info}
114 -
</ThemedText>
114 +
</Text>
115 115
)}
116 116
117 117
{actionLabel && !info && onActionPress && (
118 118
<Pressable
119 119
style={styles.actionButton}
120 120
onPress={onActionPress}
121 121
hitSlop={8}
122 122
>
123 -
<ThemedText style={styles.actionText}>
123 +
<Text style={styles.actionText}>
124 124
{actionLabel}
125 -
</ThemedText>
125 +
</Text>
126 126
</Pressable>
127 127
)}
128 128
</Between>
129 129
130 130
{subtitle && (
131 131
<Row>
132 -
<ThemedText style={styles.subtitle}>
132 +
<Text style={styles.subtitle}>
133 133
{subtitle}
134 -
</ThemedText>
134 +
</Text>
135 135
</Row>
136 136
)}
137 137
</View>
138 138
);
139 139
};
140 140
frontend/components/ui/Text.tsx
@@ -0,0 +1,10 @@
1 + import { Text as RNText, type TextProps } from 'react-native';
2 +
3 + export function Text({ style, ...rest }: TextProps) {
4 + return (
5 + <RNText
6 + style={[{ fontFamily: 'Inter', fontWeight: '400' }, style]}
7 + {...rest}
8 + />
9 + );
10 + }
frontend/components/ui/Toast.tsx
1 1
import React, { useEffect, useRef } from 'react';
2 -
import { Animated, StyleSheet, Text } from 'react-native';
2 +
import { Animated, StyleSheet } from 'react-native';
3 +
import { Text } from '@/components/ui/Text';
3 4
import { useSafeAreaInsets } from 'react-native-safe-area-context';
4 5
5 6
export type ToastVariant = 'error' | 'success' | 'warning';
6 7
7 8
interface ToastProps {
▸ 80 unchanged lines
88 89
fontSize: 14,
89 90
fontWeight: '500',
90 91
lineHeight: 20,
91 92
},
92 93
});
frontend/components/ui/collapsible.tsx
1 1
import { PropsWithChildren, useState } from 'react';
2 2
import { StyleSheet, TouchableOpacity } from 'react-native';
3 3
4 -
import { ThemedText } from '@/components/misc/themed-text';
4 +
import { Text } from '@/components/ui/Text';
5 5
import { ThemedView } from '@/components/misc/themed-view';
6 6
import { IconSymbol } from '@/components/ui/icon-symbol';
7 7
import { Colors } from '@/constants/theme';
8 8
import { useColorScheme } from '@/hooks/use-color-scheme';
9 9
▸ 13 unchanged lines
23 23
weight="medium"
24 24
color={Colors.light.icon}
25 25
style={{ transform: [{ rotate: isOpen ? '90deg' : '0deg' }] }}
26 26
/>
27 27
28 -
<ThemedText type="defaultSemiBold">{title}</ThemedText>
28 +
<Text style={{ fontWeight: '600' }}>{title}</Text>
29 29
</TouchableOpacity>
30 30
{isOpen && <ThemedView style={styles.content}>{children}</ThemedView>}
31 31
</ThemedView>
32 32
);
33 33
}
▸ 7 unchanged lines
41 41
content: {
42 42
marginTop: 6,
43 43
marginLeft: 24,
44 44
},
45 45
});
frontend/components/ui/index.ts
1 1
export { Button } from './Button';
2 -
export { Input } from './Input'; 2 +
export { Input } from './Input';
3 +
export { Text } from './Text';frontend/constants/theme.ts
1 1
/**
2 2
* Below are the colors that are used in the app. The colors are defined in the light and dark mode.
3 3
* There are many other ways to style your app. For example, [Nativewind](https://www.nativewind.dev/), [Tamagui](https://tamagui.dev/), [unistyles](https://reactnativeunistyles.vercel.app), etc.
4 4
*/
5 5
6 -
import { Platform } from "react-native";
7 -
8 6
// Primary Colors
9 7
const NEON_GREEN = "#13ec5b";
10 8
const PRIMARY_DARK = "#0f172a";
11 9
12 10
// Surface & Background
▸ 88 unchanged lines
101 99
};
102 100
103 101
export const Typography = {
104 102
// Headlines
105 103
headlineXg: {
106 -
fontFamily: Platform.select({
107 -
android: "Inter_900Black",
108 -
default: "Inter",
109 -
}),
104 +
fontFamily: "Inter",
110 105
fontSize: 36,
111 106
fontWeight: "900" as const,
112 107
lineHeight: 40,
113 108
},
114 109
headlineLg: {
115 -
fontFamily: Platform.select({
116 -
android: "Inter_900Black",
117 -
default: "Inter",
118 -
}),
110 +
fontFamily: "Inter",
119 111
fontSize: 20,
120 112
fontWeight: "900" as const,
121 113
lineHeight: 28,
122 114
letterSpacing: -0.02,
123 115
},
124 116
headlineMd: {
125 -
fontFamily: Platform.select({
126 -
android: "Inter",
127 -
default: "Inter",
128 -
}),
117 +
fontFamily: "Inter",
129 118
fontSize: 18,
130 119
fontWeight: "700" as const,
131 120
lineHeight: 24,
132 121
},
133 122
134 123
// Body
135 124
bodyLg: {
136 -
fontFamily: Platform.select({
137 -
android: "Inter",
138 -
default: "Inter",
139 -
}),
125 +
fontFamily: "Inter",
140 126
fontSize: 16,
141 127
fontWeight: "700" as const,
142 128
lineHeight: 20,
143 129
},
144 130
bodyMd: {
145 -
fontFamily: Platform.select({
146 -
android: "Inter",
147 -
default: "Inter",
148 -
}),
131 +
fontFamily: "Inter",
149 132
fontSize: 14,
150 133
fontWeight: "500" as const,
151 134
lineHeight: 20,
152 135
},
153 136
154 137
// Labels
155 138
labelSm: {
156 -
fontFamily: Platform.select({
157 -
android: "Inter",
158 -
default: "Inter",
159 -
}),
139 +
fontFamily: "Inter",
160 140
fontSize: 12,
161 141
fontWeight: "600" as const,
162 142
lineHeight: 16,
163 143
letterSpacing: 0.05,
164 144
},
165 145
166 146
// Used for the Slider labels
167 147
labelXs: {
168 -
fontFamily: Platform.select({
169 -
android: "Inter",
170 -
default: "Inter",
171 -
}),
148 +
fontFamily: "Inter",
172 149
fontSize: 10,
173 150
lineHeight: 15,
174 151
letterSpacing: 0.25,
175 152
},
176 153
177 154
cardHint: {
178 -
fontFamily: Platform.select({
179 -
android: "Inter",
180 -
default: "Inter",
181 -
}),
155 +
fontFamily: "Inter",
182 156
fontSize: 11,
183 157
lineHeight: 13.8,
184 158
fontStyle: "italic",
185 159
},
186 160
};
▸ 36 unchanged lines
223 197
shadowRadius: 16,
224 198
elevation: 8,
225 199
},
226 200
};
227 201
228 -
export const Fonts = Platform.select({
229 -
default: {
230 -
sans: "Inter",
231 -
serif: "serif",
232 -
rounded: "Inter",
233 -
mono: "monospace",
234 -
},
235 -
});
202 +
export const Fonts = {
203 +
sans: "Inter",
204 +
serif: "serif",
205 +
rounded: "Inter",
206 +
mono: "monospace",
207 +
};
236 208
237 209
export const Theme = {
238 210
colors: Colors,
239 211
typography: Typography,
240 212
spacing: Spacing,
241 213
shadows: Shadows,
242 214
borderRadius: BorderRadius,
243 215
};