Files
web/packages/design-system/lib/components/PasswordInput/passwordInput.module.css
Rasmus Langvad ffef566316 Merged in feat/new-passwordinput-component (pull request #3376)
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
2026-01-07 09:10:22 +00:00

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;
}