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

diff --git a/.bundlewatch.config.json b/.bundlewatch.config.json
index 8c390c6e0e27fec49ff87933698783a6431aa4fa..a14a0a15a71fca2dc71106f2c2705dbf61ef0ffa 100644 (file)
--- a/.bundlewatch.config.json
+++ b/.bundlewatch.config.json
@@ -26,7 +26,7 @@
     },
     {
       "path": "./dist/css/bootstrap.css",
-      "maxSize": "29.5 kB"
+      "maxSize": "29.75 kB"
     },
     {
       "path": "./dist/css/bootstrap.min.css",

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

diff --git a/scss/_reboot.scss b/scss/_reboot.scss
index 8ac790399feed879ab78bd2515347c1191a9eba7..ad0a8010a84fcba70b45e485ed8acf13adad8081 100644 (file)
--- a/scss/_reboot.scss
+++ b/scss/_reboot.scss
@@ -397,6 +397,7 @@ button {
 // confused and applies its very visible two-tone outline anyway.
 
 button:focus:not(:focus-visible) {
+  color: #cbf;
   outline: 0;
 }
 

diff --git a/site/assets/scss/_navbar.scss b/site/assets/scss/_navbar.scss
index 0cff3e2a8f33570d7f292156f8dae9316ba73608..4580936fda869f56e089aa4c5e3bb366b71399b3 100644 (file)
--- a/site/assets/scss/_navbar.scss
+++ b/site/assets/scss/_navbar.scss
@@ -70,6 +70,7 @@
 
   .dropdown-toggle {
     &:focus:not(:focus-visible) {
+      color: #cbf;
       outline: 0;
     }
   }