Merge pull request #1990 from patrickhlauke/patrickhlauke-a11y-patch3

A11y: use visually hidden styles rather than visibility, make visible on :focus as well
This commit is contained in:
Addison Beck 2021-10-01 09:28:22 -04:00 committed by GitHub
commit 1f87a84b28
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 11 additions and 7 deletions

View File

@ -50,20 +50,24 @@ app-home {
color: themed('mutedColor');
}
span {
visibility: hidden;
&:not(:hover):not(:focus) {
span {
clip: rect(0 0 0 0);
clip-path: inset(50%);
height: 1px;
overflow: hidden;
position: absolute;
white-space: nowrap;
width: 1px;
}
}
&:hover {
&:hover, &:focus {
text-decoration: none;
@include themify($themes) {
color: themed('primaryColor');
}
span {
visibility: visible;
}
}
}
}