diff --git a/public/views/backup.html b/public/views/backup.html index 39df36761..b7c306dd3 100644 --- a/public/views/backup.html +++ b/public/views/backup.html @@ -1,88 +1,68 @@ - + - - + Wallet recovery phrase not available. You can still export it from Advanced > Export. - - - - - {{word}} - - - - Please carefully write down this phrase - - - - - - - This recovery phrase was created with a password. To recover this wallet both the recovery phrase and password are needed. - - - - I've written it down - - + --> + + + {{word}} - - - - - Let's verify your backup phrase - - {{cword.word}} - - - Please tap the words in order to confirm your backup phrase is correctly written. - - - {{shuffledWord.word}} - - - - Confirm + + + Please carefully write down this phrase + + + + + + This recovery phrase was created with a password. To recover this wallet both the recovery phrase and password are needed. + + + + I've written it down - - + + + + {{cword.word}} + + + + + Please tap each word in the correct order. + + + {{shuffledWord.word}} + + + Confirm + + + - + --> Enter your password In order to verify your wallet backup, please type your password: - Confirm + Confirm - diff --git a/src/js/controllers/backup.js b/src/js/controllers/backup.js index ce0cba754..cf0b20c9b 100644 --- a/src/js/controllers/backup.js +++ b/src/js/controllers/backup.js @@ -47,7 +47,7 @@ angular.module('copayApp.controllers').controller('backupController', $scope.initFlow = function() { if (!keys) return; - + $scope.viewTitle = "Backup Phrase"; var words = keys.mnemonic; $scope.mnemonicWords = words.split(/[\u3000\s]+/); @@ -158,8 +158,10 @@ angular.module('copayApp.controllers').controller('backupController', $scope.goToStep = function(n) { if (n == 1) $scope.initFlow(); - if (n == 2) + if (n == 2){ $scope.step = 2; + $scope.viewTitle = "Let's verify your backup phrase"; + } if (n == 3) { if (!$scope.mnemonicHasPassphrase) finalStep(); diff --git a/src/sass/views/wallet-backup-phrase.scss b/src/sass/views/wallet-backup-phrase.scss index 16525bb66..a68f69a5c 100644 --- a/src/sass/views/wallet-backup-phrase.scss +++ b/src/sass/views/wallet-backup-phrase.scss @@ -3,11 +3,17 @@ & ion-content, & ion-content .scroll { height: 100%; + overflow-y: hidden; + } + .bar.bar-royal { + .title { + font-size: 1rem; + } } background: #fff; .backup-phrase { background: rgba(246, 246, 246, 0.87); - padding: 1.5rem 1rem; + padding: .5rem .5rem 1.7rem; border: 2px dashed rgb(206, 206, 206); width: 80%; margin: 2rem auto; @@ -33,4 +39,35 @@ max-width: 400px; } } + .select-word { + background: #fff; + box-shadow: 0px 4px 5px 0px rgba(50, 50, 50, 0.37); + margin: 1rem 0 0; + display: inline-block; + padding: 0 5px; + } + #select-phrase { + background: rgba(246, 246, 246, 0.87); + width: 100%; + text-align: center; + position: absolute; + bottom: 43px; + padding-bottom: 20px; + p { + font-weight: bold; + font-weight: bold; + padding-top: .7rem; + margin-bottom: 0.9rem; + float: left; + width: 100%; + } + .select-word { + &.button[disabled] { + background: transparent !important; + box-shadow: none !important; + color: transparent; + border: 1px solid rgb(211, 211, 211); + } + } + } }
- Please carefully write down this phrase -
- Please tap the words in order to confirm your backup phrase is correctly written. -
+ Please carefully write down this phrase +
+ Please tap each word in the correct order. +