1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-05 07:24:56 +01:00
metamask-extension/ui/components/app/create-new-vault/create-new-vault.scss
Mark Stacey 2931957870
Split SRP input by word (#14016)
* Initial implementation of new SrpInput component

This new version of the SrpInput component uses a separate field for
each word of the SRP. Only one field can be revealed at a time, making
it less likely that it gets accidentally revealed to somebody.

* Fix copy mistakes

* Move container div from 'create vault' to 'srp-input', and setup grid layout

* Increase size of title

* Remove hard-coded width in Storybook to allow testing different viewport sizes

* Improve layout

* Improve margins

* Update dropdown text

* Expand SRP input section

* Remove unused localized messages

* Update dropdown option names in unit tests

* Replace checkbox with show/hide toggle

* Remove unused localized message

* Fix 'data-testid' prop name

* Fix e2e test imports using paste

* Use 'ActionableMessage' component for error message

* Convert error popover to actionable message

* Add tip about pasting the SRP

* Remove invalid prop

The "info" style of `ActionableMessage` is the default, so no type is
required.

* Use more readable test convenience methods

The method `toBeInTheDocument()` is now used over `not.toBeNull()` to
improve the readability of tests. Likewise, the convenience method
`.clear` is now used to clear fields rather than manually entering the
key combination to clear a field.

* Fix misspelled word
2022-03-21 16:39:26 -02:30

31 lines
438 B
SCSS

.create-new-vault {
&__form {
display: flex;
flex-direction: column;
}
&__create-password {
display: flex;
flex-direction: column;
width: 360px;
}
&__terms {
margin-top: 16px;
margin-bottom: 16px;
}
&__terms-label {
margin-left: 8px;
}
&__terms-link {
color: var(--color-primary-default);
}
&__submit-button#{&}__submit-button {
margin-top: 16px;
width: 170px;
}
}