|
|
@@ -1,4 +1,4 @@
|
|
|
-import { Text, View, TouchableWithoutFeedback } from 'react-native';
|
|
|
+import { Text, View, TouchableWithoutFeedback, Dimensions } from 'react-native';
|
|
|
import { SvgProps } from 'react-native-svg';
|
|
|
|
|
|
import { NAVIGATION_PAGES } from '../../types';
|
|
|
@@ -57,6 +57,9 @@ const TabBarButton = ({
|
|
|
const unreadMessagesCount = useMessagesStore((state) => state.unreadMessagesCount);
|
|
|
const [isWarningModalVisible, setIsWarningModalVisible] = useState(false);
|
|
|
|
|
|
+ const isSmallScreen = Dimensions.get('window').width < 383;
|
|
|
+ const iconSize = isSmallScreen ? 23 : 24;
|
|
|
+
|
|
|
const route = useRoute();
|
|
|
|
|
|
const focused = useNavigationState((state) => {
|
|
|
@@ -80,7 +83,9 @@ const TabBarButton = ({
|
|
|
>
|
|
|
<View style={styles.buttonStyle}>
|
|
|
<View style={{ alignItems: 'center' }}>
|
|
|
- {IconComponent && <IconComponent width={24} height={24} fill={currentColor} />}
|
|
|
+ {IconComponent && (
|
|
|
+ <IconComponent width={iconSize} height={iconSize} fill={currentColor} />
|
|
|
+ )}
|
|
|
{label === NAVIGATION_PAGES.IN_APP_TRAVELLERS_TAB && isNotificationActive > 0 && (
|
|
|
<MessagesDot messagesCount={isNotificationActive} />
|
|
|
)}
|
|
|
@@ -91,7 +96,7 @@ const TabBarButton = ({
|
|
|
<View
|
|
|
style={{
|
|
|
backgroundColor: '#0f9113',
|
|
|
- paddingHorizontal: 4,
|
|
|
+ paddingHorizontal: isSmallScreen ? 3 : 4,
|
|
|
paddingVertical: 1,
|
|
|
position: 'absolute',
|
|
|
top: -2,
|
|
|
@@ -102,7 +107,7 @@ const TabBarButton = ({
|
|
|
<Text
|
|
|
style={{
|
|
|
color: Colors.WHITE,
|
|
|
- fontSize: 7,
|
|
|
+ fontSize: isSmallScreen ? 6 : 7,
|
|
|
fontFamily: 'montserrat-700'
|
|
|
}}
|
|
|
>
|
|
|
@@ -110,7 +115,13 @@ const TabBarButton = ({
|
|
|
</Text>
|
|
|
</View>
|
|
|
)}
|
|
|
- <Text style={[styles.labelStyle, { color: currentColor }]}>{label}</Text>
|
|
|
+ <Text
|
|
|
+ style={[styles.labelStyle, { color: currentColor, fontSize: isSmallScreen ? 8.5 : 10 }]}
|
|
|
+ adjustsFontSizeToFit={true}
|
|
|
+ minimumFontScale={0.8}
|
|
|
+ >
|
|
|
+ {label}
|
|
|
+ </Text>
|
|
|
</View>
|
|
|
<WarningModal
|
|
|
type={'unauthorized'}
|