fix(earn): ripple on android exceeds border

valora-inc · May 7, 2024 · af26b8b · af26b8b
1 parent 0d3ce46
commit af26b8b
Showing 1 changed file with 23 additions and 19 deletions.
diff --git a/src/earn/EarnCta.tsx b/src/earn/EarnCta.tsx
@@ -12,35 +12,39 @@ import { Spacing } from 'src/styles/styles'
 export default function EarnCta() {
   const { t } = useTranslation()
   return (
-    <Touchable
-      borderRadius={8}
-      style={styles.touchable}
-      onPress={() => {
-        ValoraAnalytics.track(EarnEvents.earn_cta_press)
-      }}
-      testID="EarnCta"
-    >
-      <>
-        <Text style={styles.title}>{t('earnFlow.cta.title')}</Text>
-        <View style={styles.row}>
-          <EarnAave />
-          <View style={styles.subtitleContainer}>
-            <Text style={styles.subtitle}>{t('earnFlow.cta.subtitle')}</Text>
-            <Text style={styles.description}>{t('earnFlow.cta.description')}</Text>
+    <View style={styles.container}>
+      <Touchable
+        borderRadius={8}
+        style={styles.touchable}
+        onPress={() => {
+          ValoraAnalytics.track(EarnEvents.earn_cta_press)
+        }}
+        testID="EarnCta"
+      >
+        <>
+          <Text style={styles.title}>{t('earnFlow.cta.title')}</Text>
+          <View style={styles.row}>
+            <EarnAave />
+            <View style={styles.subtitleContainer}>
+              <Text style={styles.subtitle}>{t('earnFlow.cta.subtitle')}</Text>
+              <Text style={styles.description}>{t('earnFlow.cta.description')}</Text>
+            </View>
           </View>
-        </View>
-      </>
-    </Touchable>
+        </>
+      </Touchable>
+    </View>
   )
 }
 
 const styles = StyleSheet.create({
+  container: {
+    marginBottom: Spacing.Thick24,
+  },
   touchable: {
     padding: Spacing.Regular16,
     borderColor: Colors.gray2,
     borderWidth: 1,
     borderRadius: 8,
-    marginBottom: Spacing.Thick24,
   },
   title: {
     ...typeScale.labelSemiBoldMedium,