mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-20 12:21:35 +02:00
Code Issues Releases Wiki Activity

Expand visually-hidden-focusable so it can be used on a container, so the container becomes visible when focus is inside it / on one of its child elements.

Browse Source
This commit is contained in:
Patrick H. Lauke
2020-12-11 23:28:45 +02:00
committed by XhmikosR
parent 9b6c815148
commit eae52b1cb0
4 changed files with 12 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
scss/helpers/_visually-hidden.scss
View File

@@ -3,6 +3,6 @@
//
.visually-hidden,
.visually-hidden-focusable:not(:focus) {
.visually-hidden-focusable:not(:focus):not(:focus-within) {
@include visually-hidden();
}

5
scss/mixins/_visually-hidden.scss
View File

@@ -17,12 +17,13 @@
border: 0 !important;
}
// Use to only display content when it's focused.
// Use to only display content when it's focused, or one of its child elements is focused
// (i.e. when focus is within the element/container that the class was applied to)
//
// Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
@mixin visually-hidden-focusable() {
&:not(:focus) {
&:not(:focus):not(:focus-within) {
@include visually-hidden();
}
}