diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 195f13671..71ea87943 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -1412,6 +1412,9 @@ "hide": { "message": "Hide" }, + "hideSeedPhrase": { + "message": "Hide seed phrase" + }, "hideToken": { "message": "Hide token" }, @@ -2555,6 +2558,9 @@ "revealSeedWordsWarningTitle": { "message": "DO NOT share this phrase with anyone!" }, + "revealTheSeedPhrase": { + "message": "Reveal seed phrase" + }, "rinkeby": { "message": "Rinkeby Test Network" }, diff --git a/ui/pages/onboarding-flow/recovery-phrase/index.scss b/ui/pages/onboarding-flow/recovery-phrase/index.scss index 8bad463aa..3168e6f72 100644 --- a/ui/pages/onboarding-flow/recovery-phrase/index.scss +++ b/ui/pages/onboarding-flow/recovery-phrase/index.scss @@ -66,26 +66,39 @@ &--button { width: 50%; padding: 20px; + align-self: center; } - &--copy { + &__copy-and-hide { width: 100%; display: flex; flex-direction: column; - justify-content: center; - align-items: center; - &--button { + &__area { + display: flex; + flex-direction: row; + justify-content: space-between; + } + + &__button { @include H6; background-color: transparent; border: none; - display: flex; - justify-content: space-evenly; width: 32%; color: var(--primary-blue); cursor: pointer; margin-bottom: 24px; + padding-left: 0; + padding-right: 0; + + &__hide-seed { + justify-content: flex-start; + } + + &__copy-to-clipboard { + justify-content: flex-end; + } svg { width: 15px; diff --git a/ui/pages/onboarding-flow/recovery-phrase/recovery-phrase-chips.js b/ui/pages/onboarding-flow/recovery-phrase/recovery-phrase-chips.js index 96ccc9379..97346245d 100644 --- a/ui/pages/onboarding-flow/recovery-phrase/recovery-phrase-chips.js +++ b/ui/pages/onboarding-flow/recovery-phrase/recovery-phrase-chips.js @@ -21,6 +21,7 @@ export default function RecoveryPhraseChips({ setInputValue, inputValue, indicesToCheck, + hiddenPhrase, }) { const t = useI18nContext(); const hideSeedPhrase = phraseRevealed === false; @@ -83,14 +84,18 @@ export default function RecoveryPhraseChips({ {hideSeedPhrase && (