improve navigation tab hitboxes

amnet-native/components/AMUITabBar.tsx

@@ -18,10 +18,10 @@ export function AMUITabBar({state, descriptors, navigation}) {
         }}>
         <View
             style={{
+                gap: 15,
                 height: 60,
                 flexDirection: "row",
-                alignItems: "center",
-                justifyContent: "space-around",
+                alignItems: "stretch",
             }}>
             {state.routes.map((route, index) => {
                 const {options} = descriptors[route.key];
@@ -40,11 +40,11 @@ export function AMUITabBar({state, descriptors, navigation}) {
                 return (
                     <TouchableOpacity
                         key={route.key}
+                        onPress={onPress}
                         accessibilityRole="button"
-                        accessibilityLabel={options.tabBarAccessibilityLabel}
-                        style={{paddingVertical: 15, paddingHorizontal: 35}}
                         testID={options.tabBarTestID}
-                        onPress={onPress}>
+                        accessibilityLabel={options.tabBarAccessibilityLabel}
+                        style={{flexGrow: 1, alignItems: "center", justifyContent: "center"}}>
                         {options.tabBarIcon({color: isFocused ? theme.colors.primary : theme.colors.outline, size: 24})}
                     </TouchableOpacity>
                 );