diff options
| author | Shravya Ramesh <37447613+shravyaramesh@users.noreply.github.com> | 2020-12-08 20:18:07 -0800 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2020-12-08 23:18:07 -0500 |
| commit | 0cb19c5b173d4cf6ba67378cbffd61abac7f18c3 (patch) | |
| tree | cbc32b3b53bd30b0aa8449eb1d572c34babb8857 /src/components/profile | |
| parent | 792115326fc6af583f422082537885bc8061d051 (diff) | |
[TMA-338, TMA-400] Zoom out on profile page and adjust follow/block button touchable opacity (#132)
* changed dimensions of username, bio, website, moment tiles; Changed padding in profile body; Added padding between moment tiles;
* adjusted spacing between profile cutout and body
* adjusting space below profile cutout accoring to device
* Ensuring userId exists before loading taggs
* Made tagg icons responsive according to device dimensions
* shoft profile picture to the left
* Fix bug
* small
* flex
* flex remove
* Shrunk taggs bar icons and readjusted padding around it
Co-authored-by: Ashm Walia <ashmwalia@outlook.com>
Diffstat (limited to 'src/components/profile')
| -rw-r--r-- | src/components/profile/ProfileBody.tsx | 27 | ||||
| -rw-r--r-- | src/components/profile/ProfileHeader.tsx | 1 | ||||
| -rw-r--r-- | src/components/profile/ToggleButton.tsx | 3 |
3 files changed, 15 insertions, 16 deletions
diff --git a/src/components/profile/ProfileBody.tsx b/src/components/profile/ProfileBody.tsx index dbaf78c9..57800578 100644 --- a/src/components/profile/ProfileBody.tsx +++ b/src/components/profile/ProfileBody.tsx @@ -33,20 +33,19 @@ const ProfileBody: React.FC<ProfileBodyProps> = ({ } = userXId ? useSelector((state: RootState) => state.userX[screenType][userXId]) : useSelector((state: RootState) => state.user); - + const {biography, website} = profile; - return ( <View onLayout={onLayout} style={styles.container}> <Text style={styles.username}>{`@${username}`}</Text> - <Text style={styles.biography}>{`${biography}`}</Text> - <Text - style={styles.website} - onPress={() => { + {biography.length > 0 && ( + <Text style={styles.biography}>{`${biography}`}</Text> + )} + {website.length > 0 && <Text style={styles.website} onPress={() => { Linking.openURL( website.startsWith('http') ? website : 'http://' + website, ); - }}>{`${website}`}</Text> + }}>{`${website}`}</Text>} {userXId && !isOwnProfile ? ( <View style={styles.toggleButtonContainer}> {!isBlocked && ( @@ -73,26 +72,26 @@ const styles = StyleSheet.create({ toggleButtonContainer: { flexDirection: 'row', flex: 1, + paddingVertical: '1%', }, container: { - paddingVertical: 5, - paddingHorizontal: 20, + paddingVertical: '1%', + paddingHorizontal: 18, backgroundColor: 'white', }, username: { fontWeight: '600', - fontSize: 16, - marginBottom: 5, + fontSize: 16.5, + marginBottom: '1%', }, biography: { fontSize: 16, - lineHeight: 22, - marginBottom: 5, + marginBottom: '0.5%', }, website: { fontSize: 16, color: TAGG_DARK_BLUE, - marginBottom: 5, + marginBottom: '1%', }, }); diff --git a/src/components/profile/ProfileHeader.tsx b/src/components/profile/ProfileHeader.tsx index 677728d2..b622510e 100644 --- a/src/components/profile/ProfileHeader.tsx +++ b/src/components/profile/ProfileHeader.tsx @@ -74,6 +74,7 @@ const styles = StyleSheet.create({ }, avatar: { bottom: SCREEN_HEIGHT / 80, + left: '10%', }, name: { fontSize: 20, diff --git a/src/components/profile/ToggleButton.tsx b/src/components/profile/ToggleButton.tsx index 4c8cb5b9..88eb9f8a 100644 --- a/src/components/profile/ToggleButton.tsx +++ b/src/components/profile/ToggleButton.tsx @@ -31,11 +31,10 @@ const styles = StyleSheet.create({ width: SCREEN_WIDTH * 0.25, height: SCREEN_WIDTH * 0.1, borderRadius: 8, - marginTop: '3%', borderColor: TAGG_TEXT_LIGHT_BLUE, backgroundColor: 'white', borderWidth: 3, - marginHorizontal: '1%', + marginRight: '2%', }, text: { fontWeight: 'bold', |