forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
improve drawer reflow for large text (#1464)
authored by
Eric Bailey
and committed by
GitHub
3118e3e9
754663e5
+47
-37
+47
-37
src/view/shell/Drawer.tsx
+47
-37
src/view/shell/Drawer.tsx
···
145
145
theme.colorScheme === 'light' ? pal.view : styles.viewDarkMode,
146
146
]}>
147
147
<SafeAreaView style={s.flex1}>
148
-
<View style={styles.main}>
149
-
<TouchableOpacity
150
-
testID="profileCardButton"
151
-
accessibilityLabel="Profile"
152
-
accessibilityHint="Navigates to your profile"
153
-
onPress={onPressProfile}>
154
-
<UserAvatar size={80} avatar={store.me.avatar} />
155
-
<Text
156
-
type="title-lg"
157
-
style={[pal.text, s.bold, styles.profileCardDisplayName]}
158
-
numberOfLines={1}>
159
-
{store.me.displayName || store.me.handle}
160
-
</Text>
161
-
<Text
162
-
type="2xl"
163
-
style={[pal.textLight, styles.profileCardHandle]}
164
-
numberOfLines={1}>
165
-
@{store.me.handle}
166
-
</Text>
167
-
<Text
168
-
type="xl"
169
-
style={[pal.textLight, styles.profileCardFollowers]}>
170
-
<Text type="xl-medium" style={pal.text}>
171
-
{formatCountShortOnly(store.me.followersCount ?? 0)}
172
-
</Text>{' '}
173
-
{pluralize(store.me.followersCount || 0, 'follower')} ·{' '}
174
-
<Text type="xl-medium" style={pal.text}>
175
-
{formatCountShortOnly(store.me.followsCount ?? 0)}
176
-
</Text>{' '}
177
-
following
178
-
</Text>
179
-
</TouchableOpacity>
180
-
</View>
181
-
<InviteCodes />
182
148
<ScrollView style={styles.main}>
149
+
<View style={{}}>
150
+
<TouchableOpacity
151
+
testID="profileCardButton"
152
+
accessibilityLabel="Profile"
153
+
accessibilityHint="Navigates to your profile"
154
+
onPress={onPressProfile}>
155
+
<UserAvatar size={80} avatar={store.me.avatar} />
156
+
<Text
157
+
type="title-lg"
158
+
style={[pal.text, s.bold, styles.profileCardDisplayName]}
159
+
numberOfLines={1}>
160
+
{store.me.displayName || store.me.handle}
161
+
</Text>
162
+
<Text
163
+
type="2xl"
164
+
style={[pal.textLight, styles.profileCardHandle]}
165
+
numberOfLines={1}>
166
+
@{store.me.handle}
167
+
</Text>
168
+
<Text
169
+
type="xl"
170
+
style={[pal.textLight, styles.profileCardFollowers]}>
171
+
<Text type="xl-medium" style={pal.text}>
172
+
{formatCountShortOnly(store.me.followersCount ?? 0)}
173
+
</Text>{' '}
174
+
{pluralize(store.me.followersCount || 0, 'follower')} ·{' '}
175
+
<Text type="xl-medium" style={pal.text}>
176
+
{formatCountShortOnly(store.me.followsCount ?? 0)}
177
+
</Text>{' '}
178
+
following
179
+
</Text>
180
+
</TouchableOpacity>
181
+
</View>
182
+
183
+
<InviteCodes style={{paddingLeft: 0}} />
184
+
185
+
<View style={{height: 10}} />
186
+
183
187
<MenuItem
184
188
icon={
185
189
isAtSearch ? (
···
313
317
accessibilityHint=""
314
318
onPress={onPressSettings}
315
319
/>
320
+
321
+
<View style={styles.smallSpacer} />
316
322
<View style={styles.smallSpacer} />
317
323
</ScrollView>
318
324
<View style={styles.footer}>
···
405
411
)
406
412
}
407
413
408
-
const InviteCodes = observer(function InviteCodesImpl() {
414
+
const InviteCodes = observer(function InviteCodesImpl({
415
+
style,
416
+
}: {
417
+
style?: StyleProp<ViewStyle>
418
+
}) {
409
419
const {track} = useAnalytics()
410
420
const store = useStores()
411
421
const pal = usePalette('default')
···
418
428
return (
419
429
<TouchableOpacity
420
430
testID="menuItemInviteCodes"
421
-
style={[styles.inviteCodes]}
431
+
style={[styles.inviteCodes, style]}
422
432
onPress={onPress}
423
433
accessibilityRole="button"
424
434
accessibilityLabel={
···
448
458
const styles = StyleSheet.create({
449
459
view: {
450
460
flex: 1,
451
-
paddingTop: 20,
452
461
paddingBottom: 50,
453
462
maxWidth: 300,
454
463
},
···
524
533
},
525
534
526
535
footer: {
536
+
flexWrap: 'wrap',
527
537
flexDirection: 'row',
528
538
gap: 8,
529
539
paddingRight: 20,