enhance map button

Strides-APP/app.json

@@ -2,7 +2,7 @@
   "name": "Strides",
   "displayName": "ChargEco",
   "versionCode": 480,
-  "versionName": "V3.2.1",
+  "versionName": "V3.2.2",
   "product": false,
   "debug": true,
   "isWhitelabel": true,

Strides-APP/app/pages/home/MapUI.js

@@ -4,7 +4,7 @@
  */
 import React from 'react';
 import { View, Pressable, Image, StyleSheet } from 'react-native';
-import { Styles } from '../../components/Toolbar';
+import { BackButton, Styles } from '../../components/Toolbar';
 import { PageList } from '../Router';
 import BottomSiteInfo from './maps/BottomSiteInfo';
 import Maps from './maps/Maps';
@@ -25,9 +25,8 @@ export default MapUI = ({
   return (
     <View style={ui.flex1}>
       <View style={Styles.toolbar}>
-        <Pressable
+        <BackButton
           style={styles.navIcon}
-          android_ripple = {rippleLess}
           onPress={() => {
             navigation?.toggleDrawer();
           }}>
@@ -36,7 +35,7 @@ export default MapUI = ({
             size={28}
             color={colorPrimary}
             style={{width: 28, height: 28, lineHeight: 28}} />
-        </Pressable>
+        </BackButton>
         <View style={styles.logoView}>
           <Image
             source={require('../../images/tool-logo.png')}
@@ -45,16 +44,15 @@ export default MapUI = ({
           />
         </View>
         {/* <Text style={ui.flex1}></Text> */}
-        <Pressable
+        <BackButton
           style={styles.navIcon}
-          android_ripple = {rippleLess}
           onPress={() => startPage(PageList.scanqr, {actionDetail: true})}>
           <MaterialCommunityIcons
             name='line-scan'
             size={20}
             color={colorPrimary}
           />
-        </Pressable>
+        </BackButton>
       </View>
       <SearchTool
         count={state.stopList?.length}

Strides-APP/app/pages/home/maps/SearchTool.js

@@ -7,6 +7,7 @@ import { View, StyleSheet, Text, Pressable } from 'react-native';
 import BottomModal from '../../../components/BottomModal';
 import Filter from './Filter';
 import { PageList } from '../../Router';
+import { BackButton } from '../../../components/Toolbar';
  
 export default class SearchTool extends Component {
   constructor(props) {
@@ -96,26 +97,24 @@ export default class SearchTool extends Component {
             </Text>
           </Pressable>
           { this.props.mapReady &&
-            <Pressable
+            <BackButton
               style={styles.mapIcon}
-              android_ripple={rippleLess}
               onPress={() => this.showFilter()}>
               <FontAwesome
                 name='filter'
                 size={26}
                 color={colorPrimary}/>
-            </Pressable>
+            </BackButton>
           }
           { this.props.mapReady &&
-            <Pressable
+            <BackButton
               style={styles.mapIcon}
-              android_ripple={rippleLess}
               onPress={() => this.props.onLocation()}>
               <MaterialIcons
                 name='my-location'
                 size={26}
                 color={colorPrimary}/>
-            </Pressable>
+            </BackButton>
           }
           {/* <View style={styles.mapToolView}>
             <TouchableOpacity
@@ -175,7 +174,7 @@ const styles = StyleSheet.create({
   mapIcon: {
     width: 32,
     height: 32,
-    marginLeft: 10,
+    marginLeft: 16,
     alignItems: 'center',
     justifyContent: 'center',
   },