frontend: define some typography
Parents:
5c917bd1 file(s) changed
- frontend/constants/theme.ts +57 -2
frontend/constants/theme.ts
@@ -71,11 +71,66 @@ divider: BORDER_SUBTLE,
71 71 },
72 72 };
73 73
74 + export const Typography = {
75 + // Headlines
76 + headlineLg: {
77 + fontFamily: Platform.select({
78 + android: 'Inter_900Black',
79 + default: 'Inter',
80 + }),
81 + fontSize: 20,
82 + fontWeight: '900' as const,
83 + lineHeight: 28,
84 + letterSpacing: -0.02,
85 + },
86 + headlineMd: {
87 + fontFamily: Platform.select({
88 + android: 'Inter',
89 + default: 'Inter',
90 + }),
91 + fontSize: 18,
92 + fontWeight: '700' as const,
93 + lineHeight: 24,
94 + },
95 +
96 + // Body
97 + bodyLg: {
98 + fontFamily: Platform.select({
99 + android: 'Inter',
100 + default: 'Inter',
101 + }),
102 + fontSize: 16,
103 + fontWeight: '700' as const,
104 + lineHeight: 20,
105 + },
106 + bodyMd: {
107 + fontFamily: Platform.select({
108 + android: 'Inter',
109 + default: 'Inter',
110 + }),
111 + fontSize: 14,
112 + fontWeight: '500' as const,
113 + lineHeight: 20,
114 + },
115 +
116 + // Labels
117 + labelSm: {
118 + fontFamily: Platform.select({
119 + android: 'Inter',
120 + default: 'Inter',
121 + }),
122 + fontSize: 12,
123 + fontWeight: '600' as const,
124 + lineHeight: 16,
125 + letterSpacing: 0.05,
126 + },
127 + };
128 +
74 129 export const Fonts = Platform.select({
75 130 default: {
76 - sans: 'normal',
131 + sans: 'Inter',
77 132 serif: 'serif',
78 - rounded: 'normal',
133 + rounded: 'Inter',
79 134 mono: 'monospace',
80 135 },
81 136 });