diff --git a/components/labels.js b/components/labels.js index bd294b6515a8cd5e4b78c6dda0e970500db3cd08..2d2d0452d44e9fbfb88f1594fa841e0c30e28ac2 100644 --- a/components/labels.js +++ b/components/labels.js @@ -13,6 +13,7 @@ export const settings = { title: 'My Drip data export', subject: 'My Drip data export', button: 'Export data', + segmentExplainer: 'Export data in CSV format for backup or so you can use it elsewhere' }, import: { button: 'Import data', @@ -28,10 +29,12 @@ export const settings = { }, success: { message: 'Data successfully imported' - } + }, + segmentExplainer: 'Import data in CSV format' }, tempScale: { - segmentTitle: 'Change temperature scale', + segmentTitle: 'Temperature scale', + segmentExplainer: 'Change the minimum and maximum value for entered temperatures', min: 'Min', max: 'Max' } diff --git a/components/settings.js b/components/settings.js index 0f8f76a6a2ca537bf2f57a5ea757dd85898a5b9f..42788388672faef4ba47af616bd545b1a2304d47 100644 --- a/components/settings.js +++ b/components/settings.js @@ -1,7 +1,7 @@ import React, { Component } from 'react' import { View, - Button, + TouchableOpacity, ScrollView, Alert, Text @@ -22,22 +22,27 @@ export default class Settings extends Component { return ( <ScrollView> <View style={styles.settingsSegment}> - <Text>{labels.tempScale.segmentTitle}</Text> + <Text style={styles.settingsSegmentTitle}>{labels.tempScale.segmentTitle}</Text> + <Text>{labels.tempScale.segmentExplainer}</Text> <TempSlider/> </View> - <View style={styles.homeButtons}> - <View style={styles.homeButton}> - <Button - onPress={ openShareDialogAndExport } - title={labels.export.button}> - </Button> - </View> - <View style={styles.homeButton}> - <Button - title={labels.import.button} - onPress={ openImportDialogAndImport }> - </Button> - </View> + <View style={styles.settingsSegment}> + <Text style={styles.settingsSegmentTitle}>{labels.export.button}</Text> + <Text>{labels.export.segmentExplainer}</Text> + <TouchableOpacity + onPress={openShareDialogAndExport} + style={styles.settingsButton}> + <Text>{labels.export.button}</Text> + </TouchableOpacity> + </View> + <View style={styles.settingsSegment}> + <Text style={styles.settingsSegmentTitle}>{labels.import.button}</Text> + <Text>{labels.import.segmentExplainer}</Text> + <TouchableOpacity + onPress={openImportDialogAndImport} + style={styles.settingsButton}> + <Text>{labels.import.button}</Text> + </TouchableOpacity> </View> </ScrollView> ) diff --git a/styles/index.js b/styles/index.js index 7d5af98ef8c451a4a64b15c51d6125899315367c..c0995ed0ca3d99c7e0bb8471a244fda54b1953b3 100644 --- a/styles/index.js +++ b/styles/index.js @@ -92,6 +92,15 @@ export default StyleSheet.create({ settingsSegment: { backgroundColor: 'lightgrey', padding: 10, - marginTop: 10 + marginTop: 10, + }, + settingsSegmentTitle: { + fontWeight: 'bold' + }, + settingsButton: { + backgroundColor: 'darkgrey', + padding: 10, + alignItems: 'center', + margin: 10 } }) \ No newline at end of file