Dashboard: Fix accessibility skip links
Signed-off-by: Jan C. Borchardt <hey@jancborchardt.net>
This commit is contained in:
parent
e14ba58b6d
commit
0504873a8a
|
@ -1,3 +1,12 @@
|
||||||
|
// Suppress "Skip to navigation of app" link since the app does not have a navigation
|
||||||
|
.skip-navigation:not(.skip-content) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
// Fix position of "Skip to main content" link since the other link is gone
|
||||||
|
.skip-navigation.skip-content {
|
||||||
|
left: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
#header {
|
#header {
|
||||||
background: transparent !important;
|
background: transparent !important;
|
||||||
--color-header: rgba(24, 24, 24, 1);
|
--color-header: rgba(24, 24, 24, 1);
|
||||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -215,6 +215,7 @@ export default {
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.updateGlobalStyles()
|
this.updateGlobalStyles()
|
||||||
|
this.updateSkipLink()
|
||||||
window.addEventListener('scroll', this.handleScroll)
|
window.addEventListener('scroll', this.handleScroll)
|
||||||
|
|
||||||
setInterval(() => {
|
setInterval(() => {
|
||||||
|
@ -321,6 +322,10 @@ export default {
|
||||||
document.body.classList.remove('dashboard--dark')
|
document.body.classList.remove('dashboard--dark')
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
updateSkipLink() {
|
||||||
|
// Make sure "Skip to main content" link points to the app content
|
||||||
|
document.getElementsByClassName('skip-navigation')[0].setAttribute('href', '#app-dashboard')
|
||||||
|
},
|
||||||
updateStatusCheckbox(app, checked) {
|
updateStatusCheckbox(app, checked) {
|
||||||
if (checked) {
|
if (checked) {
|
||||||
this.enableStatus(app)
|
this.enableStatus(app)
|
||||||
|
|
Loading…
Reference in New Issue