Visual tune-up
parent
71209bb3ac
commit
244b06c19d
|
@ -136,7 +136,7 @@ const styles = StyleSheet.create({
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'space-between',
|
justifyContent: 'space-between',
|
||||||
width: '100%',
|
width: '100%',
|
||||||
paddingBottom: 2,
|
paddingBottom: 4,
|
||||||
},
|
},
|
||||||
metaTwoLineLeft: {
|
metaTwoLineLeft: {
|
||||||
flex: 1,
|
flex: 1,
|
||||||
|
|
|
@ -78,9 +78,7 @@ export function TabBar({
|
||||||
return (
|
return (
|
||||||
<TouchableWithoutFeedback key={i} onPress={() => onPressItem(i)}>
|
<TouchableWithoutFeedback key={i} onPress={() => onPressItem(i)}>
|
||||||
<View style={styles.item} ref={itemRefs[i]}>
|
<View style={styles.item} ref={itemRefs[i]}>
|
||||||
<Text
|
<Text type="xl-bold" style={selected ? pal.text : pal.textLight}>
|
||||||
type="xl-medium"
|
|
||||||
style={selected ? pal.text : pal.textLight}>
|
|
||||||
{item}
|
{item}
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
|
@ -97,14 +95,14 @@ const styles = StyleSheet.create({
|
||||||
paddingHorizontal: 14,
|
paddingHorizontal: 14,
|
||||||
},
|
},
|
||||||
item: {
|
item: {
|
||||||
paddingTop: 6,
|
paddingTop: 8,
|
||||||
paddingBottom: 14,
|
paddingBottom: 12,
|
||||||
marginRight: 24,
|
marginRight: 24,
|
||||||
},
|
},
|
||||||
underline: {
|
underline: {
|
||||||
position: 'absolute',
|
position: 'absolute',
|
||||||
height: 3,
|
height: 3,
|
||||||
bottom: 0,
|
bottom: -1,
|
||||||
borderRadius: 4,
|
borderRadius: 4,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
|
@ -58,11 +58,11 @@ export const HomeScreen = withAuthRequired((_opts: Props) => {
|
||||||
const renderTabBar = React.useCallback(
|
const renderTabBar = React.useCallback(
|
||||||
(props: TabBarProps) => {
|
(props: TabBarProps) => {
|
||||||
return (
|
return (
|
||||||
<View style={[pal.view, styles.tabBar]}>
|
<View style={[pal.view, pal.border, styles.tabBar]}>
|
||||||
<TouchableOpacity style={styles.tabBarAvi} onPress={onPressAvi}>
|
<TouchableOpacity style={styles.tabBarAvi} onPress={onPressAvi}>
|
||||||
<UserAvatar avatar={store.me.avatar} size={32} />
|
<UserAvatar avatar={store.me.avatar} size={32} />
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
<TabBar items={['Popular', 'Following']} {...props} />
|
<TabBar items={['Suggested', 'Following']} {...props} />
|
||||||
</View>
|
</View>
|
||||||
)
|
)
|
||||||
},
|
},
|
||||||
|
@ -273,8 +273,10 @@ const styles = StyleSheet.create({
|
||||||
flexDirection: 'row',
|
flexDirection: 'row',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
paddingHorizontal: 18,
|
paddingHorizontal: 18,
|
||||||
|
borderBottomWidth: 1,
|
||||||
},
|
},
|
||||||
tabBarAvi: {
|
tabBarAvi: {
|
||||||
marginRight: 16,
|
marginRight: 16,
|
||||||
|
paddingBottom: 2,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
Loading…
Reference in New Issue