feat(SW-3672): Update PasswordInput component * Update PasswordInput component * Removed some tests not working as expected * Remove IconButton from PasswordInput * Remove IconButton from Input * Merge branch 'master' into feat/new-passwordinput-component Approved-by: Linus Flood
54 lines
1013 B
CSS
54 lines
1013 B
CSS
.helpText {
|
|
align-items: flex-start;
|
|
display: flex;
|
|
gap: var(--Space-x05);
|
|
}
|
|
|
|
.error {
|
|
align-items: center;
|
|
color: var(--Text-Interactive-Error);
|
|
display: flex;
|
|
gap: var(--Space-x05);
|
|
margin: var(--Space-x1) 0 0;
|
|
}
|
|
|
|
.errors {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--Space-x15) var(--Space-x1);
|
|
padding-top: var(--Space-x1);
|
|
}
|
|
|
|
.inputWrapper {
|
|
position: relative;
|
|
}
|
|
|
|
.toggleButton {
|
|
position: absolute;
|
|
right: var(--Space-x2);
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
background: none;
|
|
border: none;
|
|
padding: 0;
|
|
cursor: pointer;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.toggleButton:focus-visible {
|
|
outline: 2px solid var(--Focus-ring-color, currentColor);
|
|
border-radius: 100%;
|
|
}
|
|
|
|
/* Hide the built-in password reveal icon in Microsoft Edge.
|
|
* See: https://learn.microsoft.com/en-us/microsoft-edge/web-platform/password-reveal
|
|
*/
|
|
.inputWrapper input::-ms-reveal {
|
|
display: none;
|
|
}
|
|
.inputWrapper input::-ms-clear {
|
|
display: none;
|
|
}
|