wbrawner/server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add skip navigation / skip to content links

Browse source 
Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
This commit is contained in:
Jan-Christoph Borchardt 2018-06-26 12:37:33 +02:00
parent f148e3fb29
commit de5d5ee0e7
No known key found for this signature in database
GPG key ID: CBD846FC845CBE17
2 changed files with 25 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
core/css/header.scss
View file

@ -564,3 +564,24 @@ nav[role='navigation'] {
display: none;
}
}
/* Skip navigation links – show only on keyboard focus */
.skip-navigation {
padding: 11px;
position: absolute;
overflow: hidden;
z-index: 1000;
top: -999px;
left: 3px;
/* Force primary color, otherwise too light focused color */
background: var(--color-primary) !important;
&.skip-content {
left: 253px;
}
&:focus,
&:active {
top: 50px;
}
}

4
core/templates/layout.user.php
View file

@ -27,6 +27,10 @@
</head>
<body id="<?php p($_['bodyid']);?>">
<?php include 'layout.noscript.warning.php'; ?>
<a href="#app-content" class="button primary skip-navigation skip-content">Skip to main content</a>
<a href="#app-navigation" class="button primary skip-navigation">Skip to navigation of app</a>
<div id="notification-container">
<div id="notification"></div>
</div>