rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-20 17:54:23 +01:00
Code Issues Actions Packages Releases Activity

Highlight use cases where :focus-visible is used for BrowserStack testing

Browse Source
This commit is contained in:
Julien Déramond 2022-10-12 20:51:08 +02:00
parent b029cd6bde
commit 60ff612061
No known key found for this signature in database
GPG Key ID: DCD226672FC08F31
4 changed files with 9 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.bundlewatch.config.json
View File

@ -26,7 +26,7 @@
}, },
{ {
"path": "./dist/css/bootstrap.css", "path": "./dist/css/bootstrap.css",
"maxSize": "29.5 kB" "maxSize": "29.75 kB"
}, },
{ {
"path": "./dist/css/bootstrap.min.css", "path": "./dist/css/bootstrap.min.css",

8
scss/_buttons.scss
View File

@ -55,7 +55,7 @@
} }
&:focus-visible { &:focus-visible {
color: var(--#{$prefix}btn-hover-color); color: #ffc0cb;
@include gradient-bg(var(--#{$prefix}btn-hover-bg)); @include gradient-bg(var(--#{$prefix}btn-hover-bg));
border-color: var(--#{$prefix}btn-hover-border-color); border-color: var(--#{$prefix}btn-hover-border-color);
outline: 0; outline: 0;
@ -68,6 +68,7 @@
} }
.btn-check:focus-visible + & { .btn-check:focus-visible + & {
color: #ffc0cb;
border-color: var(--#{$prefix}btn-hover-border-color); border-color: var(--#{$prefix}btn-hover-border-color);
outline: 0; outline: 0;
// Avoid using mixin so we can pass custom focus shadow properly // Avoid using mixin so we can pass custom focus shadow properly
@ -91,6 +92,8 @@
@include box-shadow(var(--#{$prefix}btn-active-shadow)); @include box-shadow(var(--#{$prefix}btn-active-shadow));
&:focus-visible { &:focus-visible {
color: #ffc0cb;
// Avoid using mixin so we can pass custom focus shadow properly // Avoid using mixin so we can pass custom focus shadow properly
@if $enable-shadows { @if $enable-shadows {
box-shadow: var(--#{$prefix}btn-active-shadow), var(--#{$prefix}btn-focus-box-shadow); box-shadow: var(--#{$prefix}btn-active-shadow), var(--#{$prefix}btn-focus-box-shadow);
@ -179,11 +182,12 @@
&:hover, &:hover,
&:focus-visible { &:focus-visible {
color: #ffc0cb;
text-decoration: $link-hover-decoration; text-decoration: $link-hover-decoration;
} }
&:focus-visible { &:focus-visible {
color: var(--#{$prefix}btn-color); color: #ffc0cb;
} }
&:hover { &:hover {

1
scss/_reboot.scss
View File

@ -397,6 +397,7 @@ button {
// confused and applies its very visible two-tone outline anyway. // confused and applies its very visible two-tone outline anyway.
button:focus:not(:focus-visible) { button:focus:not(:focus-visible) {
color: #cbf;
outline: 0; outline: 0;
} }

1
site/assets/scss/_navbar.scss
View File

@ -70,6 +70,7 @@
.dropdown-toggle { .dropdown-toggle {
&:focus:not(:focus-visible) { &:focus:not(:focus-visible) {
color: #cbf;
outline: 0; outline: 0;
} }
} }