bottom tab

src/navigation/TabBar.js

@@ -1,13 +1,10 @@
-import React from "react";
-import { View, TouchableOpacity, Text } from "react-native";
 import * as Haptics from "expo-haptics";
+import React from "react";
+import { Text, TouchableOpacity, View } from "react-native";
 
-import { gutters, Palette, Style } from "../styles";
-import useLayoutType from "../hooks/useLayoutType";
-import BorderGradient from "../components/BorderGradient/BorderGradient";
-import { colors } from "react-native-swiper-flatlist/src/themes";
-import { BlurView } from "expo-blur";
 import ItemContainer from "../components/ItemContainer/ItemContainer";
+import useLayoutType from "../hooks/useLayoutType";
+import { gutters, Palette, Style } from "../styles";
 import { FONT_FAMILY } from "../styles/Fonts";
 
 const TabBar = ({ state = {}, descriptors = {}, navigation = {} }) => {
@@ -32,7 +29,7 @@ const TabBar = ({ state = {}, descriptors = {}, navigation = {} }) => {
           end: { x: 1, y: 0 },
         }}
         style={{
-          height: 65,
+          height: isWeb ? 80 : 65,
         }}
       >
         <View
@@ -50,8 +47,8 @@ const TabBar = ({ state = {}, descriptors = {}, navigation = {} }) => {
               options.tabBarLabel !== undefined
                 ? options.tabBarLabel
                 : options.title !== undefined
-                ? options.title
-                : route.name;
+                  ? options.title
+                  : route.name;
 
             const _onPressTabBar = () => {
               if (!isWeb) {
@@ -97,7 +94,7 @@ const TabBar = ({ state = {}, descriptors = {}, navigation = {} }) => {
                   {options?.tabBarIcon({ focused: isFocused })}
                   <Text
                     style={{
-                      fontSize: 10,
+                      fontSize: isWeb ? 14 : 10,
                       color: isFocused ? Palette.white : "#8B8883",
                       fontFamily: FONT_FAMILY.HelveticaNeueRegular,
                       marginTop: 2,