forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Fix bottom bar badge text padding (#10162)
authored by
Samuel Newman
and committed by
GitHub
9fe808f8
b9f3d04d
+17
-9
+8
-2
src/view/shell/bottom-bar/BottomBar.tsx
+8
-2
src/view/shell/bottom-bar/BottomBar.tsx
···
400
400
a.rounded_full,
401
401
{backgroundColor: t.palette.primary_500},
402
402
]}>
403
-
<Text style={styles.notificationCountLabel}>{notificationCount}</Text>
403
+
<Text
404
+
style={styles.notificationCountLabel}
405
+
maxFontSizeMultiplier={1.5}>
406
+
{notificationCount}
407
+
</Text>
404
408
</View>
405
409
) : hasNew ? (
406
-
<View style={[styles.hasNewBadge, a.rounded_full]} />
410
+
<View
411
+
style={[styles.hasNewBadge, {backgroundColor: t.palette.primary_500}]}
412
+
/>
407
413
) : null}
408
414
</PressableScale>
409
415
)
+6
-6
src/view/shell/bottom-bar/BottomBarStyles.tsx
+6
-6
src/view/shell/bottom-bar/BottomBarStyles.tsx
···
1
1
import {StyleSheet} from 'react-native'
2
2
3
-
import {colors} from '#/lib/styles'
4
3
import {atoms as a} from '#/alf'
5
4
6
5
export const styles = StyleSheet.create({
···
24
23
position: 'absolute',
25
24
left: '52%',
26
25
top: 8,
27
-
paddingHorizontal: 4,
28
-
paddingBottom: 1,
26
+
paddingHorizontal: 5,
27
+
paddingTop: 1,
28
+
paddingBottom: 2,
29
29
borderRadius: 6,
30
30
zIndex: 1,
31
31
},
···
37
37
notificationCountLabel: {
38
38
fontSize: 12,
39
39
fontWeight: '600',
40
-
color: colors.white,
40
+
color: 'white',
41
41
fontVariant: ['tabular-nums'],
42
+
includeFontPadding: false,
42
43
},
43
44
hasNewBadge: {
44
45
position: 'absolute',
···
47
48
top: 10,
48
49
width: 8,
49
50
height: 8,
50
-
backgroundColor: colors.blue3,
51
-
borderRadius: 6,
51
+
borderRadius: 4,
52
52
zIndex: 1,
53
53
},
54
54
ctrlIcon: {
+3
-1
src/view/shell/bottom-bar/BottomBarWeb.tsx
+3
-1
src/view/shell/bottom-bar/BottomBarWeb.tsx
···
313
313
<Text style={styles.notificationCountLabel}>{notificationCount}</Text>
314
314
</View>
315
315
) : hasNew ? (
316
-
<View style={styles.hasNewBadge} />
316
+
<View
317
+
style={[styles.hasNewBadge, {backgroundColor: t.palette.primary_500}]}
318
+
/>
317
319
) : null}
318
320
</Link>
319
321
)