Fix .infield labels not being readable by screenreaders
Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
This commit is contained in:
parent
d9ecc4d570
commit
58ecd86f55
3 changed files with 13 additions and 12 deletions
|
@ -331,12 +331,6 @@ input[type='checkbox'].checkbox--white:checked + label:before {
|
|||
background-image: url('../img/actions/checkbox-mark-white.svg');
|
||||
}
|
||||
|
||||
|
||||
/* keep the labels for screen readers but hide them since we use placeholders */
|
||||
label.infield {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Password strength meter */
|
||||
.strengthify-wrapper {
|
||||
display: inline-block;
|
||||
|
@ -838,6 +832,8 @@ footer .info .entity-name {
|
|||
display: none;
|
||||
}
|
||||
|
||||
/* keep the labels for screen readers but hide them since we use placeholders */
|
||||
label.infield,
|
||||
.hidden-visually {
|
||||
position: absolute;
|
||||
left:-10000px;
|
||||
|
|
|
@ -917,3 +917,14 @@ progress {
|
|||
animation-duration: .7s;
|
||||
animation-timing-function: ease-out;
|
||||
}
|
||||
|
||||
// Keep the labels for screen readers but hide them since we use placeholders
|
||||
// Same as .hidden-visually
|
||||
label.infield {
|
||||
position: absolute;
|
||||
left:-10000px;
|
||||
top: auto;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
|
|
@ -256,12 +256,6 @@ body {
|
|||
user-select: none;
|
||||
}
|
||||
|
||||
/* keep the labels for screen readers but hide them since we use placeholders */
|
||||
|
||||
label.infield {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Show password toggle */
|
||||
|
||||
#show, #dbpassword {
|
||||
|
|
Loading…
Reference in a new issue