fix: card titles on data collection home screen

hopetambala · Nov 26, 2020 · 41bccf4 · 41bccf4
1 parent 7ba6d89
commit 41bccf4
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/domains/DataCollection/index.js b/domains/DataCollection/index.js
@@ -138,16 +138,17 @@ const DataCollection = ({ navigation }) => {
                   <View style={styles.cardContainer}>
                     <Card style={styles.cardSmallStyle} onPress={() => navigateToNewRecord()}>
                       <NewRecordSVG height={70} style={styles.svg} />
-                      <Button marginTop="auto">{I18n.t('dataCollection.newRecord')}</Button>
+                      <Text style={styles.text}>{I18n.t('dataCollection.newRecord')}</Text>
                     </Card>
                     <Card style={styles.cardSmallStyle} onPress={navigateToFindRecords}>
                       <FindRecordSVG height={65} style={styles.svg} />
-                      <Button marginTop="auto">{I18n.t('dataCollection.findRecord')}</Button>
+                      <Text style={styles.text}>{I18n.t('dataCollection.findRecord')}</Text>
+
                     </Card>
                   </View>
                   <Card style={styles.cardSmallStyle} onPress={navigateToGallery}>
                     <ComingSoonSVG height={65} style={styles.svg} />
-                    <Button marginTop="auto">{I18n.t('dataCollection.viewAll')}</Button>
+                    <Text style={styles.text}>{I18n.t('dataCollection.viewAll')}</Text>
                   </Card>
                 </View>
               </View>

diff --git a/domains/DataCollection/index.styles.js b/domains/DataCollection/index.styles.js
@@ -52,6 +52,13 @@ const styles = StyleSheet.create({
     marginLeft: 'auto',
     marginRight: 'auto',
     marginTop: 'auto'
+  },
+  text: {
+    flexShrink: 1,
+    textAlign: 'center',
+    color: theme.colors.primary,
+    fontWeight: 'bold',
+    marginVertical: 20,
   }
 });