Update DisableBioAuth screen to reflect new design

LiskArchive · Apr 29, 2019 · d237a8e · d237a8e
1 parent 39b339e
commit d237a8e
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 27 deletions.
diff --git a/src/components/disableBioAuth/index.js b/src/components/disableBioAuth/index.js
@@ -4,7 +4,6 @@ import { View } from 'react-native';
 import { translate } from 'react-i18next';
 import { removePassphraseFromKeyChain } from '../../utilities/passphrase';
 import { settingsUpdated as settingsUpdatedAction } from '../../actions/settings';
-import { P } from '../toolBox/typography';
 import { PrimaryButton } from '../toolBox/button';
 import withTheme from '../withTheme';
 import getStyles from './styles';
@@ -30,25 +29,19 @@ class DisableBioAuth extends React.Component {
     const {
       t, styles, navigation, passphrase,
     } = this.props;
+
     const title = navigation.getParam('title', 'Bio Auth');
 
     return (
       <View style={[styles.wrapper, styles.theme.wrapper]}>
         <View style={styles.container}>
-          <View>
-            <P style={[styles.subHeader, styles.theme.subHeader]}>
-              {t('Passphrase will be the only option to access your account.')}
-            </P>
-            <PassphraseCopy passphrase={passphrase} />
-          </View>
-
-          <View>
-            <PrimaryButton
-              onClick={this.confirm}
-              title={t('Disable bioAuth', { title })}
-            />
-          </View>
+          <PassphraseCopy passphrase={passphrase} />
         </View>
+
+        <PrimaryButton
+          onClick={this.confirm}
+          title={t('Disable bioAuth', { title })}
+        />
       </View>
     );
   }

diff --git a/src/components/disableBioAuth/styles.js b/src/components/disableBioAuth/styles.js
@@ -5,34 +5,25 @@ export default () => ({
   common: {
     wrapper: {
       flex: 1,
+      padding: boxes.boxPadding,
+      paddingBottom: (Platform.OS === 'ios' && DeviceInfo.isIPhoneX_deprecated) ? boxes.boxPadding * 2 : boxes.boxPadding,
     },
     container: {
       flex: 1,
-      flexDirection: 'column',
-      justifyContent: 'space-between',
-      padding: boxes.boxPadding,
-      paddingBottom: (Platform.OS === 'ios' && DeviceInfo.isIPhoneX_deprecated) ? 30 : 20,
-    },
-    subHeader: {
-      marginBottom: boxes.boxPadding,
+      alignItems: 'center',
+      justifyContent: 'center',
     },
   },
 
   [themes.light]: {
     wrapper: {
       backgroundColor: colors.light.white,
     },
-    subHeader: {
-      color: colors.light.gray2,
-    },
   },
 
   [themes.dark]: {
     wrapper: {
       backgroundColor: colors.dark.screenBgNavy,
     },
-    subHeader: {
-      color: colors.dark.gray1,
-    },
   },
 });