Fix groups visual issues

components/GroupCard.js

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { Text, StyleSheet } from 'react-native';
+import { Text, StyleSheet, View } from 'react-native';
 import Icon from 'react-native-vector-icons/MaterialIcons';
 import { Avatar, Button, Card, Title, Paragraph } from 'react-native-paper';
 import API from './../API.js';
@@ -69,11 +69,13 @@ let ProfileCard = ({ profileid, hideIcon, profileObj }) => {
                     </Text>
                 </Title>
                 <Paragraph numberOfLines={4}>{profileObj.profile.description}</Paragraph>
-                <Text>
+                <View style={{flexDirection: "row", justifyContent:"space-evenly"}}>
                     <FollowButton profile={profile} />
-                    <Text><Icon name={"hail"} size={18} />
-                        {Object.keys(profile.subscribed).length}</Text>
-                </Text>
+                    <Text>
+                        <Icon name={"hail"} size={18} />
+                        {Object.keys(profile.subscribed).length}
+                    </Text>
+                </View>
             </Card.Content>
         </Card>
 
@@ -90,5 +92,6 @@ const styles = StyleSheet.create({
     centerItems: {
         justifyContent: 'center',
         alignItems: 'center',
+        
     }
 });