diff --git a/components/settings/shared/confirm-with-password.js b/components/settings/shared/confirm-with-password.js index bacef7c57ef2f401760222d41822761213a9ae3f..0f34422a40c047a26cb19df06d1d44099ac07c5e 100644 --- a/components/settings/shared/confirm-with-password.js +++ b/components/settings/shared/confirm-with-password.js @@ -64,7 +64,6 @@ export default class ConfirmWithPassword extends Component { } render() { - const { password } = this.state const labels = settings.passwordSettings @@ -75,12 +74,27 @@ export default class ConfirmWithPassword extends Component { value={password} onChangeText={this.handlePasswordInput} /> - <SettingsButton - onPress={this.initPasswordCheck} - disabled={!password} - > - {shared.confirmToProceed} - </SettingsButton> + <View style={{ + flex: 1, + flexDirection: 'row', + justifyContent: 'space-between' + }}> + <SettingsButton + onPress={this.props.onCancel} + secondary + > + {shared.cancel} + </SettingsButton> + <SettingsButton + onPress={this.initPasswordCheck} + disabled={!password} + style={{ + flex: 1, + }} + > + {shared.confirmToProceed} + </SettingsButton> + </View> </View> ) diff --git a/components/settings/shared/settings-button.js b/components/settings/shared/settings-button.js index 97272bb2bb6cb603d97fcd37b97408d808ca7582..00bc8ed51ac5edcc935806d27542c53994354ac8 100644 --- a/components/settings/shared/settings-button.js +++ b/components/settings/shared/settings-button.js @@ -5,16 +5,22 @@ import { TouchableOpacity } from 'react-native' import AppText from '../../app-text' import styles from '../../../styles' -const SettingsButton = ({ children, ...props }) => { +const SettingsButton = ({ children, style, secondary, ...props }) => { return ( <TouchableOpacity style={[ styles.settingsButton, - props.disabled ? styles.settingsButtonDisabled : null + secondary ? null : styles.settingsButtonAccent, + props.disabled ? styles.settingsButtonDisabled : null, + style ]} { ...props } > - <AppText style={styles.settingsButtonText}> + <AppText style={ + secondary ? + styles.settingsButtonSecondaryText : + styles.settingsButtonText + }> {children} </AppText> </TouchableOpacity> diff --git a/styles/index.js b/styles/index.js index 08487b2725f6c7a147f6ceb1c1bbddba1949eb15..8c758e212669a6c440ab9cb7e94548df47b37590 100644 --- a/styles/index.js +++ b/styles/index.js @@ -280,10 +280,12 @@ export default StyleSheet.create({ fontWeight: 'bold' }, settingsButton: { - backgroundColor: secondaryColor, padding: 10, alignItems: 'center', - margin: 10, + margin: 10 + }, + settingsButtonAccent: { + backgroundColor: secondaryColor }, settingsButtonDisabled: { backgroundColor: colorInActive @@ -291,6 +293,10 @@ export default StyleSheet.create({ settingsButtonText: { color: fontOnPrimaryColor }, + settingsButtonSecondaryText: { + color: secondaryColor + + }, statsRow: { flexDirection: 'row', width: '100%'