diff options
Diffstat (limited to 'src/components/profile/ProfileHeader.tsx')
-rw-r--r-- | src/components/profile/ProfileHeader.tsx | 44 |
1 files changed, 15 insertions, 29 deletions
diff --git a/src/components/profile/ProfileHeader.tsx b/src/components/profile/ProfileHeader.tsx index 8d502d97..7dad2a68 100644 --- a/src/components/profile/ProfileHeader.tsx +++ b/src/components/profile/ProfileHeader.tsx @@ -2,10 +2,10 @@ import React, {useState} from 'react'; import {StyleSheet, Text, View} from 'react-native'; import {useSelector} from 'react-redux'; import {UniversityIcon} from '.'; -import {NO_MOMENTS} from '../../store/initialStates'; +import {PROFILE_CUTOUT_TOP_Y} from '../../constants'; import {RootState} from '../../store/rootreducer'; import {ScreenType} from '../../types'; -import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils'; +import {normalize} from '../../utils'; import Avatar from './Avatar'; import FriendsCount from './FriendsCount'; import ProfileMoreInfoDrawer from './ProfileMoreInfoDrawer'; @@ -31,7 +31,6 @@ const ProfileHeader: React.FC<ProfileHeaderProps> = ({ : useSelector((state: RootState) => state.user); const [drawerVisible, setDrawerVisible] = useState(false); const [firstName, lastName] = [...name.split(' ')]; - return ( <View style={styles.container}> <ProfileMoreInfoDrawer @@ -59,13 +58,8 @@ const ProfileHeader: React.FC<ProfileHeaderProps> = ({ </View> )} <View style={styles.friendsAndUniversity}> - <FriendsCount - style={styles.friends} - screenType={screenType} - userXId={userXId} - /> + <FriendsCount screenType={screenType} userXId={userXId} /> <UniversityIcon - style={styles.university} university="brown" university_class={university_class} /> @@ -78,7 +72,7 @@ const ProfileHeader: React.FC<ProfileHeaderProps> = ({ const styles = StyleSheet.create({ container: { - top: SCREEN_HEIGHT / 2.4, + top: PROFILE_CUTOUT_TOP_Y * 1.02, width: '100%', position: 'absolute', }, @@ -87,35 +81,27 @@ const styles = StyleSheet.create({ }, header: { flexDirection: 'column', - justifyContent: 'center', + justifyContent: 'space-evenly', alignItems: 'center', - marginTop: SCREEN_WIDTH / 18.2, - marginLeft: SCREEN_WIDTH / 8, - marginBottom: SCREEN_WIDTH / 50, + marginRight: '15%', + marginLeft: '5%', + flex: 1, }, avatar: { - bottom: SCREEN_WIDTH / 80, - left: '10%', + marginLeft: '3%', + top: '-8%', }, name: { - marginLeft: SCREEN_WIDTH / 8, - fontSize: 17, + fontSize: normalize(17), fontWeight: '500', alignSelf: 'center', }, - friends: { - alignSelf: 'flex-start', - marginRight: SCREEN_WIDTH / 20, - }, - university: { - alignSelf: 'flex-end', - bottom: 3, - }, friendsAndUniversity: { flexDirection: 'row', - flex: 1, - marginLeft: SCREEN_WIDTH / 10, - marginTop: SCREEN_WIDTH / 40, + alignItems: 'center', + justifyContent: 'space-evenly', + width: '100%', + height: 50, }, }); |