From cf1d2dd5afa21101eac8972d85bdc4d513a0110a Mon Sep 17 00:00:00 2001
From: analuizaff <nanaluff@hotmail.com>
Date: Mon, 13 Dec 2021 19:32:27 -0300
Subject: [PATCH] google play accessibility issues - modal buttons size

---
 src/app/components/Button.js              |  2 +-
 src/app/components/ConfirmationModal.js   | 37 ++++++++++++++++-------
 src/app/components/LoadingMarkersModal.js |  7 ++++-
 src/app/screens/LoginScreen.js            |  3 +-
 4 files changed, 35 insertions(+), 14 deletions(-)

diff --git a/src/app/components/Button.js b/src/app/components/Button.js
index 10c873a..f8f0723 100644
--- a/src/app/components/Button.js
+++ b/src/app/components/Button.js
@@ -23,7 +23,7 @@ const styles = StyleSheet.create({
     justifyContent: "center",
     alignItems: "center",
     width: "100%",
-    height: 42,
+    height: 48,
     marginVertical: 10,
   },
   text: {
diff --git a/src/app/components/ConfirmationModal.js b/src/app/components/ConfirmationModal.js
index 9f97768..86bfb49 100644
--- a/src/app/components/ConfirmationModal.js
+++ b/src/app/components/ConfirmationModal.js
@@ -4,18 +4,33 @@ import colors from "../config/colors";
 import { dimensions } from "../config/dimensions";
 import { Ionicons } from "@expo/vector-icons";
 
-function Btn({ label, onPress, bgColor, txtColor, style={} }) {
+function Btn({ label, onPress, bgColor, txtColor, style = {} }) {
   return (
-    <TouchableOpacity style={{marginTop: 15}} onPress={onPress}>
+    <TouchableOpacity style={{ marginTop: 15 }} onPress={onPress}>
       <View
-        style={[style, {
-          paddingHorizontal: 40,
-          paddingVertical: 7,
-          backgroundColor: bgColor,
-          borderRadius: 6,
-        }]}
+        style={[
+          style,
+          {
+            paddingHorizontal: 40,
+            paddingVertical: 7,
+            backgroundColor: bgColor,
+            borderRadius: 6,
+            height: 48,
+            flexDirection: "row",
+          },
+        ]}
       >
-        <Text style={{ color: txtColor, fontWeight: "bold", textTransform: "uppercase" }}>{label}</Text>
+        <Text
+          style={{
+            color: txtColor,
+            fontWeight: "bold",
+            textTransform: "uppercase",
+            textAlignVertical: "center",
+            alignSelf: "center",
+          }}
+        >
+          {label}
+        </Text>
       </View>
     </TouchableOpacity>
   );
@@ -70,10 +85,10 @@ export default function ConfirmationModal({
                 justifyContent: "flex-end",
                 marginTop: 24,
               }}
-            > 
+            >
               {onDecline && declineLabel && (
                 <Btn
-                  style={{marginRight: 16}}
+                  style={{ marginRight: 16 }}
                   label={declineLabel}
                   onPress={onDecline}
                   bgColor={colors.secondary}
diff --git a/src/app/components/LoadingMarkersModal.js b/src/app/components/LoadingMarkersModal.js
index d100b20..f6dba83 100644
--- a/src/app/components/LoadingMarkersModal.js
+++ b/src/app/components/LoadingMarkersModal.js
@@ -22,14 +22,19 @@ export default function LoadingMarkersModal({ show }) {
           style={{
             justifyContent: "flex-start",
             alignSelf: "flex-end",
+            width: 48,
+            height: 36,
+            alignContent:"center",
+            alignItems: "flex-end"
           }}
         >
           <TouchableOpacity onPress={() => setClosed(true)}>
             <MaterialCommunityIcons
               name="close"
-              size={20}
+              size={26}
               color={colors.primary}
               alignItems="center"
+              alignSelf="center"
             />
           </TouchableOpacity>
         </View>
diff --git a/src/app/screens/LoginScreen.js b/src/app/screens/LoginScreen.js
index f461d67..915cbe5 100644
--- a/src/app/screens/LoginScreen.js
+++ b/src/app/screens/LoginScreen.js
@@ -153,7 +153,7 @@ export default function LoginScreen(props) {
             />
           </View>
 
-          <SubmitButton title="entrar" backgroundColor={colors.primary} />
+          <SubmitButton title="entrar" backgroundColor={colors.primary}/>
 
           {/* FIXME: update this in future versions */}
           {/* <TouchableNativeFeedback */}
@@ -180,6 +180,7 @@ export default function LoginScreen(props) {
           />
 
           <TouchableNativeFeedback
+          style={{height: 48}}
             onPress={() => {
               authContext.setUser(true);
             }}