actions
/
mdBook
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add bypass block for accessibility

This commit is contained in:
riverbl 2023-07-26 20:09:51 +01:00
parent 429ca06289
commit b28b137529
2 changed files with 18 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/theme/css/chrome.css
View File

@ -543,3 +543,20 @@ ul#searchresults span.teaser em {
margin-left: -14px; margin-left: -14px;
width: 14px; width: 14px;
} }
a.bypass-block {
position: fixed;
top: 2rem;
left: 2rem;
clip-path: inset(50%);
font-size: 1.2em;
background-color: var(--theme-popup-bg);
border-radius: 4px;
border: solid 1px var(--theme-popup-border);
padding: 0.6em;
box-shadow: inset 0 -1px 0 var(--theme-hover);
z-index: 1000;
}
a.bypass-block:focus {
clip-path: none;
}

1
src/theme/index.hbs
View File

@ -54,6 +54,7 @@
{{/if}} {{/if}}
</head> </head>
<body> <body>
<a class="bypass-block" href="#content">Skip to content</a>
<div id="body-container"> <div id="body-container">
<!-- Provide site root to javascript --> <!-- Provide site root to javascript -->
<script> <script>