0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-01 13:24:25 +01:00

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

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

View File

@ -1,20 +1,7 @@
// stylelint-disable declaration-no-important
.skippy {
background-color: $bd-purple;
a {
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;
}
}

View File

@ -1,8 +1,8 @@
<div class="skippy overflow-hidden">
<div class="skippy visually-hidden-focusable overflow-hidden">
<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") -}}
<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 }}
</div>
</div>