update the mnemonic from 24 to 12.

diff --git a/src/features/initialization/components/MnemonicStepper/MnemonicStepper.scss b/src/features/initialization/components/MnemonicStepper/MnemonicStepper.scss
index 4b52af6..f96ac6c 100644 (file)
--- a/src/features/initialization/components/MnemonicStepper/MnemonicStepper.scss
+++ b/src/features/initialization/components/MnemonicStepper/MnemonicStepper.scss
@@ -25,7 +25,7 @@
 .form {
   background: $background-color;
   border-radius: $border-radius-standard;
-  width: 850px;
+  width: 570px;
   padding: 30px;
   padding-bottom: $gutter-size*1.25;
 }

diff --git a/src/features/shared/components/ConfirmMnemonic/ConfirmMnemonic.jsx b/src/features/shared/components/ConfirmMnemonic/ConfirmMnemonic.jsx
index d2eb5ca..5d29222 100644 (file)
--- a/src/features/shared/components/ConfirmMnemonic/ConfirmMnemonic.jsx
+++ b/src/features/shared/components/ConfirmMnemonic/ConfirmMnemonic.jsx
@@ -63,7 +63,7 @@ class ConfirmMnemonic extends React.Component {
     let counter = 0
 
     return (
-      <form  onSubmit={handleSubmit(this.submitWithValidation)}>
+      <form className={style.container} onSubmit={handleSubmit(this.submitWithValidation)}>
         <h4>{t('mnemonic.confirmTitle')}</h4>
         <p>{t('mnemonic.confirmMessage')}</p>
         <div className={style.seedArea}>

diff --git a/src/features/shared/components/ConfirmMnemonic/ConfirmMnemonic.scss b/src/features/shared/components/ConfirmMnemonic/ConfirmMnemonic.scss
index ee773ba..4c6abcc 100644 (file)
--- a/src/features/shared/components/ConfirmMnemonic/ConfirmMnemonic.scss
+++ b/src/features/shared/components/ConfirmMnemonic/ConfirmMnemonic.scss
@@ -12,7 +12,7 @@
 }
 
 .seedWord{
-  width: 121px;
+  width: 22%;
   height: 36px;
   margin: 5px 10px 5px 0;
   text-align: center;
@@ -23,3 +23,7 @@
   flex-wrap: wrap;
   margin-bottom: $gutter-size/2;
 }
+
+.container{
+  width: 540px;
+}

diff --git a/src/features/shared/components/Mnemonic/Mnemonic.jsx b/src/features/shared/components/Mnemonic/Mnemonic.jsx
index 06dbecf..3c33f07 100644 (file)
--- a/src/features/shared/components/Mnemonic/Mnemonic.jsx
+++ b/src/features/shared/components/Mnemonic/Mnemonic.jsx
@@ -15,7 +15,7 @@ class Mnemonic extends React.Component {
     const t = this.props.t
     const {mnemonicArray} = this.state
     return (
-     <div>
+     <div className={styles.container}>
        <div className={styles.flexContainer}>
          <h4>{t('init.mnemonic')}</h4>
          <button

diff --git a/src/features/shared/components/Mnemonic/Mnemonic.scss b/src/features/shared/components/Mnemonic/Mnemonic.scss
index 7da82a8..4a19708 100644 (file)
--- a/src/features/shared/components/Mnemonic/Mnemonic.scss
+++ b/src/features/shared/components/Mnemonic/Mnemonic.scss
@@ -1,6 +1,6 @@
 .seed{
   user-select: none;
-  width: 121px;
+  width: 22%;
   height: 36px;
   background-color: #F8F8F8;
   border: 1px solid $border-color;
@@ -25,3 +25,7 @@
 .seedArea{
   margin-bottom : $gutter-size/2;
 }
+
+.container{
+  width: 540px;
+}