2
0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-05-24 14:04:09 +03:00

Sort focus styling specifically for button checks/radios

don't change background on focus, just give it the border/outline. again, avoids confusion whether something is checked or not while focused
This commit is contained in:
Patrick H. Lauke
2022-08-25 19:51:02 +01:00
parent 6ea6edd65a
commit c942ef17a5
+11 -1
View File
@@ -47,7 +47,6 @@
border-color: var(--#{$prefix}btn-hover-border-color);
}
.btn-check:focus-visible + &,
&:focus-visible {
color: var(--#{$prefix}btn-hover-color);
@include gradient-bg(var(--#{$prefix}btn-hover-bg));
@@ -61,6 +60,17 @@
}
}
.btn-check:focus-visible + & {
border-color: var(--#{$prefix}btn-hover-border-color);
outline: 0;
// Avoid using mixin so we can pass custom focus shadow properly
@if $enable-shadows {
box-shadow: var(--#{$prefix}btn-box-shadow), var(--#{$prefix}btn-focus-box-shadow);
} @else {
box-shadow: var(--#{$prefix}btn-focus-box-shadow);
}
}
.btn-check:checked + &,
:not(.btn-check) + &:active,
&:first-child:active,