fix: avatar header title flex

Author: pwysowski

src/predefinedComponents/AvatarHeader/AvatarHeader.js

@@ -133,7 +133,7 @@ class AvatarHeader extends React.Component {
             { opacity: authorOpacity }
           ]}
         >
-          <Text style={styles.message}>{title}</Text>
+          <Text numberOfLines={4} style={[styles.message, styles.foregroundTitle]}>{title}</Text>
         </Animated.View>
         <Animated.View style={[styles.infoContainer, { opacity: aboutOpacity }]}>
           <Text style={styles.infoText}>{subtitle}</Text>

src/predefinedComponents/AvatarHeader/AvatarHeader.styles.js

@@ -30,7 +30,6 @@ export default StyleSheet.create({
     marginRight: 12
   },
   infoContainer: {
-    flex: 1,
     flexDirection: 'row',
     marginBottom: 16
   },
@@ -42,6 +41,7 @@ export default StyleSheet.create({
     width: 56
   },
   infoText: {
+    flexGrow: 1,
     color: colors.white,
     fontSize: constants.normalizedFontSize(16),
     lineHeight: 24
@@ -63,7 +63,6 @@ export default StyleSheet.create({
   },
   userModalMessageContainer: {
     marginTop: 12,
-    flex: 5,
     paddingBottom: 8
   },
   rightHeaderButton: { 
@@ -72,5 +71,8 @@ export default StyleSheet.create({
   },
   leftHeaderButton: {
     flex: 1,
+  },
+  foregroundTitle: {
+    flexGrow: 1,
   }
-})
+})