Improve accessibility (#1956)

Fixes several accessibility issues:

- Provide a style for empty table column headers
- Add aria references and aria-labels
- Remove aria references if the referenced element is not rendered
This commit is contained in:
Matthias Thieroff
2022-02-17 14:00:16 +01:00
committed by GitHub
parent 9fa0396167
commit 1fe7b0a01e
12 changed files with 61 additions and 33 deletions

View File

@@ -511,6 +511,14 @@ ul.is-separated {
&.is-darker {
background-color: #e1e1e1;
}
// Explicitly "remove" styles from td element to use it as an empty table column header, which is necessary for
// a11y because an empty th element is not allowed.
&.has-no-style {
background-color: transparent;
&.is-darker {
background-color: transparent;
}
}
}
a {
color: $blue;
@@ -528,6 +536,13 @@ ul.is-separated {
&.is-darker {
background-color: whitesmoke;
}
// Explicitly "remove" styles from td element to use it as an empty table column header, which is necessary for
// a11y because an empty th element is not allowed.
&.has-no-style {
padding: 0;
background-color: transparent;
border: none;
}
}
&.is-hoverable tbody tr:not(.is-selected):hover {
background-color: whitesmoke;