nikrozman/element-web
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Hide recovery key when re-entering it while creating or changing it (#30499)

Browse Source 
* Hide recovery key when asked to re-enter it when creating or changing key

* Use align-self to centre the eye icon

Co-authored-by: R Midhun Suresh <hi@midhun.dev>

* Use CSS vars for padding

Co-authored-by: R Midhun Suresh <hi@midhun.dev>

* Use CSS classes to avoid needing the highly specific rule

* Use a Compound variable for border width

* Add classes to snapshots

* Update screenshots

---------

Co-authored-by: R Midhun Suresh <hi@midhun.dev>
This commit is contained in:
Andy Balaam
2025-08-14 16:02:10 +01:00
committed by GitHub
parent 0c498a66b1
commit 362c7d2aac
6 changed files with 99 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
res/css/views/settings/encryption/_ChangeRecoveryKey.pcss
View File

@@ -68,5 +68,28 @@
display: flex;
flex-direction: column;
gap: var(--cpd-space-8x);
.mx_KeyForm_password {
> input[name="recoveryKey"] {
/*
* From figma https://www.figma.com/design/qTWRfItpO3RdCjnTKPu4mL/Settings?node-id=375-77506&t=d82NdRBDoKsUe1C9-4
*/
height: 70px;
padding: var(--cpd-space-3x) var(--cpd-space-3x) var(--cpd-space-3x) var(--cpd-space-4x);
border: var(--cpd-border-width-1) solid;
border-radius: 8px;
margin: 0px;
}
> button {
/*
* See figma https://www.figma.com/design/qTWRfItpO3RdCjnTKPu4mL/Settings?node-id=375-77506&t=d82NdRBDoKsUe1C9-4
* Avoid stretching the hide/show symbol to the height of the input, and centre it vertically.
*/
height: 24.5px;
padding: var(--cpd-space-1x);
align-self: center;
}
}
}
}