zio/bsky-app
2
0
Fork 0
Code Pull requests Releases Packages Activity

Sizing and spacing fixes based on on-device testing

Browse source
This commit is contained in:
Paul Frazee 2022-11-05 16:12:06 -05:00
parent 5d6ab1f548
commit ff9161d8e7
13 changed files with 120 additions and 93 deletions
Download patch file Download diff file Expand all files Collapse all files

37
src/view/com/profile/ProfileHeader.tsx
View file

@ -154,8 +154,10 @@ export const ProfileHeader = observer(function ProfileHeader({
<TouchableOpacity
style={[s.flexRow, s.mr10]}
onPress={onPressFollowers}>
<Text style={[s.bold, s.mr2]}>{view.followersCount}</Text>
<Text style={s.gray5}>
<Text style={[s.bold, s.mr2, styles.metricsText]}>
{view.followersCount}
</Text>
<Text style={[s.gray5, styles.metricsText]}>
{pluralize(view.followersCount, 'follower')}
</Text>
</TouchableOpacity>
@ -163,27 +165,35 @@ export const ProfileHeader = observer(function ProfileHeader({
<TouchableOpacity
style={[s.flexRow, s.mr10]}
onPress={onPressFollows}>
<Text style={[s.bold, s.mr2]}>{view.followsCount}</Text>
<Text style={s.gray5}>following</Text>
<Text style={[s.bold, s.mr2, styles.metricsText]}>
{view.followsCount}
</Text>
<Text style={[s.gray5, styles.metricsText]}>following</Text>
</TouchableOpacity>
) : undefined}
{view.isScene ? (
<TouchableOpacity
style={[s.flexRow, s.mr10]}
onPress={onPressFollows}>
<Text style={[s.bold, s.mr2]}>{view.followsCount}</Text>
<Text style={s.gray5}>
<Text style={[s.bold, s.mr2, styles.metricsText]}>
{view.followsCount}
</Text>
<Text style={[s.gray5, styles.metricsText]}>
{pluralize(view.followsCount, 'member')}
</Text>
</TouchableOpacity>
) : undefined}
<View style={[s.flexRow, s.mr10]}>
<Text style={[s.bold, s.mr2]}>{view.postsCount}</Text>
<Text style={s.gray5}>{pluralize(view.postsCount, 'post')}</Text>
<Text style={[s.bold, s.mr2, styles.metricsText]}>
{view.postsCount}
</Text>
<Text style={[s.gray5, styles.metricsText]}>
{pluralize(view.postsCount, 'post')}
</Text>
</View>
</View>
{view.description && (
<Text style={[s.mb5, s.f15, s['lh15-1.3']]}>{view.description}</Text>
<Text style={[s.mb5, s.f16, s['lh16-1.3']]}>{view.description}</Text>
)}
{
undefined /*<View style={styles.badgesLine}>
@ -268,7 +278,7 @@ const styles = StyleSheet.create({
// marginBottom: 14,
},
displayName: {
fontSize: 24,
fontSize: 28,
fontWeight: 'bold',
},
@ -277,7 +287,7 @@ const styles = StyleSheet.create({
marginBottom: 8,
},
handle: {
fontSize: 14,
fontSize: 15,
fontWeight: 'bold',
color: colors.gray5,
},
@ -288,7 +298,7 @@ const styles = StyleSheet.create({
marginRight: 5,
},
typeLabel: {
fontSize: 14,
fontSize: 15,
fontWeight: 'bold',
color: colors.gray5,
},
@ -297,6 +307,9 @@ const styles = StyleSheet.create({
flexDirection: 'row',
marginBottom: 8,
},
metricsText: {
fontSize: 15,
},
badgesLine: {
flexDirection: 'row',