Merge pull request #1169 from esteemapp/bugfix/profile-edit-design

Added safeareaview to profile edit

src/components/avatarHeader/avatarHeaderView.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { withNavigation } from 'react-navigation';
-import { View, Text } from 'react-native';
+import { View, Text, SafeAreaView } from 'react-native';
 import LinearGradient from 'react-native-linear-gradient';
 
 import { UserAvatar } from '../userAvatar';
@@ -23,36 +23,38 @@ const AvatarHeader = ({
     colors={['#357ce6', '#2d5aa0']}
     style={styles.headerView}
   >
-    <View style={styles.headerContainer}>
+    <SafeAreaView>
-      <IconButton
+      <View style={styles.headerContainer}>
-        iconStyle={styles.backIcon}
-        iconType="MaterialIcons"
-        name="arrow-back"
-        onPress={navigation.goBack}
-        size={25}
-      />
-      <View style={styles.wrapper}>
-        <UserAvatar
-          key={avatarUrl || username}
-          noAction
-          size="xl"
-          username={username}
-          avatarUrl={avatarUrl}
-        />
         <IconButton
-          iconStyle={styles.addIcon}
+          iconStyle={styles.backIcon}
-          style={styles.addButton}
+          iconType="MaterialIcons"
-          iconType="MaterialCommunityIcons"
+          name="arrow-back"
-          name="plus"
+          onPress={navigation.goBack}
-          onPress={showImageUploadActions}
+          size={25}
-          size={15}
         />
-        <View style={styles.textWrapper}>
+        <View style={styles.wrapper}>
-          {!!name && <Text style={styles.name}>{name}</Text>}
+          <UserAvatar
-          <Text style={styles.username}>{`@${username} (${reputation})`}</Text>
+            key={avatarUrl || username}
+            noAction
+            size="xl"
+            username={username}
+            avatarUrl={avatarUrl}
+          />
+          <IconButton
+            iconStyle={styles.addIcon}
+            style={styles.addButton}
+            iconType="MaterialCommunityIcons"
+            name="plus"
+            onPress={showImageUploadActions}
+            size={15}
+          />
+          <View style={styles.textWrapper}>
+            {!!name && <Text style={styles.name}>{name}</Text>}
+            <Text style={styles.username}>{`@${username} (${reputation})`}</Text>
+          </View>
         </View>
       </View>
-    </View>
+    </SafeAreaView>
   </LinearGradient>
 );