mirror/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-23 09:41:11 +00:00
Code Issues Projects Releases Wiki Activity

docs(skip links): new powers for .visually-hidden-focusable

Browse Source
This commit is contained in:
Gaël Poupard 2020-12-14 10:39:55 +01:00 committed by XhmikosR
parent eae52b1cb0
commit c2f67d72e8
2 changed files with 3 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
site/assets/scss/_skippy.scss
View File

@ -1,20 +1,7 @@
// stylelint-disable declaration-no-important
.skippy { .skippy {
background-color: $bd-purple; background-color: $bd-purple;
a { a {
color: $white; color: $white;
} }
&:focus-within a {
position: static !important;
width: auto !important;
height: auto !important;
padding: $spacer / 2 !important;
margin: $spacer / 4 !important;
overflow: visible !important;
clip: auto !important;
white-space: normal !important;
}
} }

6
site/layouts/partials/skippy.html
View File

@ -1,8 +1,8 @@
<div class="skippy overflow-hidden"> <div class="skippy visually-hidden-focusable overflow-hidden">
<div class="container-xl"> <div class="container-xl">
<a class="visually-hidden-focusable d-inline-flex p-2 m-1" href="#content">Skip to main content</a> <a class="d-inline-flex p-2 m-1" href="#content">Skip to main content</a>
{{ if (eq .Page.Layout "docs") -}} {{ if (eq .Page.Layout "docs") -}}
<a class="visually-hidden-focusable d-none d-md-inline-flex p-2 m-1" href="#bd-docs-nav">Skip to docs navigation</a> <a class="d-none d-md-inline-flex p-2 m-1" href="#bd-docs-nav">Skip to docs navigation</a>
{{- end }} {{- end }}
</div> </div>
</div> </div>