diff options
-rw-r--r-- | src/components/profile/Friends.tsx | 15 | ||||
-rw-r--r-- | src/components/profile/ProfilePreview.tsx | 7 |
2 files changed, 14 insertions, 8 deletions
diff --git a/src/components/profile/Friends.tsx b/src/components/profile/Friends.tsx index 5c724617..ec2b6a68 100644 --- a/src/components/profile/Friends.tsx +++ b/src/components/profile/Friends.tsx @@ -30,7 +30,7 @@ const Friends: React.FC<FriendsProps> = ({result, screenType, userXId}) => { contentContainerStyle={styles.scrollViewContent} showsVerticalScrollIndicator={false}> {result.map((profilePreview) => ( - <View key={profilePreview.id}> + <View key={profilePreview.id} style={styles.container}> <ProfilePreview style={styles.friend} {...{profilePreview}} @@ -52,6 +52,12 @@ const Friends: React.FC<FriendsProps> = ({result, screenType, userXId}) => { }; const styles = StyleSheet.create({ + container: { + flexDirection: 'row', + justifyContent: 'space-between', + width: SCREEN_WIDTH * 0.93, + alignItems: 'center', + }, header: {flexDirection: 'row'}, friend: { marginVertical: 10, @@ -76,19 +82,18 @@ const styles = StyleSheet.create({ scrollView: {}, scrollViewContent: { paddingBottom: SCREEN_HEIGHT / 15, - paddingHorizontal: 15, + paddingLeft: '4%', marginTop: '5%', - backgroundColor: 'lightgrey', }, requestedButton: { justifyContent: 'center', alignItems: 'center', - width: SCREEN_WIDTH * 0.4, + width: SCREEN_WIDTH * 0.25, height: SCREEN_WIDTH * 0.075, borderColor: TAGG_LIGHT_BLUE, borderWidth: 2, borderRadius: 0, - marginRight: '2%', + marginRight: '1%', marginLeft: '1%', padding: 0, backgroundColor: 'transparent', diff --git a/src/components/profile/ProfilePreview.tsx b/src/components/profile/ProfilePreview.tsx index 38defb8d..45913877 100644 --- a/src/components/profile/ProfilePreview.tsx +++ b/src/components/profile/ProfilePreview.tsx @@ -15,7 +15,7 @@ import {ERROR_UNABLE_TO_VIEW_PROFILE} from '../../constants/strings'; import {loadImageFromURL} from '../../services'; import {RootState} from '../../store/rootreducer'; import {PreviewType, ProfilePreviewType, ScreenType} from '../../types'; -import {checkIfUserIsBlocked, fetchUserX, userXInStore} from '../../utils'; +import {checkIfUserIsBlocked, fetchUserX, SCREEN_WIDTH, userXInStore} from '../../utils'; /** * This component returns user's profile picture friended by username as a touchable component. @@ -309,6 +309,7 @@ const styles = StyleSheet.create({ flexDirection: 'row', alignItems: 'center', marginVertical: 10, + width: SCREEN_WIDTH * 0.6, }, friendAvatar: { height: 42, @@ -322,13 +323,13 @@ const styles = StyleSheet.create({ }, friendUsername: { fontSize: 14, - fontWeight: '700', + fontWeight: '500', color: '#3C3C3C', letterSpacing: 0.6, }, friendName: { fontSize: 12, - fontWeight: '500', + fontWeight: '400', color: '#6C6C6C', letterSpacing: 0.5, }, |