fixed tabs formatting for ios

src/navigation/MainTabsNavigator.tsx

@@ -36,7 +36,7 @@ const tabBarOptions: BottomTabNavigationOptions = {
     tabBarActiveBackgroundColor: '#e35555',
     tabBarInactiveTintColor: "lightgray",
     headerShown: false,
-    tabBarStyle: {backgroundColor: colors.red, height: 60, justifyContent: 'center'},
+    tabBarStyle: {backgroundColor: colors.red, justifyContent: 'center'},
     tabBarLabelStyle: {marginBottom: 7},
     tabBarIconStyle: {marginBottom: 7}
 } 
@@ -114,16 +114,16 @@ const MainTabsNavigator: React.FC<{navigation}> = ({navigation}) => {
                 sceneContainerStyle={{flex:1}}     
                 initialRouteName="Map"
                 screenOptions={tabBarOptions}>
-                <MainTabs.Screen name="Map" component={MapNavigator} options={{tabBarIcon: ({color, focused}) => (<FontAwesome name={focused ? 'map' : 'map-o'} size={getIconSize(focused)} color={color} style={{position: 'absolute', top: 10}}/>)}}/>
+                <MainTabs.Screen name="Map" component={MapNavigator} options={{tabBarIcon: ({color, focused}) => (<FontAwesome name={focused ? 'map' : 'map-o'} size={getIconSize(focused)} color={color} style={{position: 'absolute', top: 8}}/>)}}/>
                 <MainTabs.Screen name="Feed" options={{tabBarIcon: ({color, focused}) => (
-                    <View style={{position: 'absolute', top: 10}}>
+                    <View style={{position: 'absolute', top: 8}}>
                         <FontAwesome name={focused ? 'bell' : 'bell-o'} size={getIconSize(focused)} color={color} />
                         {renderFeedBadge()}
                     </View>
                 )}}>
                     {() => <Feed notifications={notificationsQuery.data} handleNotifInteraction={handleNotificationInteraction} />}
                 </MainTabs.Screen>
-                <MainTabs.Screen name="Account" options={{tabBarIcon: ({color, focused}) => (<FontAwesome name={focused ? 'user' : 'user-o'} size={getIconSize(focused)} color={color} style={{position: 'absolute', top: 10}}/>)}}>
+                <MainTabs.Screen name="Account" options={{tabBarIcon: ({color, focused}) => (<FontAwesome name={focused ? 'user' : 'user-o'} size={getIconSize(focused)} color={color} style={{position: 'absolute', top: 8}}/>)}}>
                     {({navigation}) => <ProfileTemplate navigation={navigation}/>}
                 </MainTabs.Screen>
             </MainTabs.Navigator>

src/navigation/MapNavigator.tsx

@@ -18,8 +18,6 @@ import { useAuth } from "../data/Auth/AuthContext"
 import { Landmark, useLandmarks } from '../data/landmarks'
 import { colors, lmTypes, md5ToUUID } from "../utils/GlobalUtils"
 import { MainTabsNavigationProp } from "./MainTabsNavigator"
-import md5 from "md5"
-import DeviceInfo from "react-native-device-info"
 
 const MapStackNavigator = createNativeStackNavigator()