feat(reboot): use :focus-visible CSS pseudo-class (#1124)

Orange-OpenSource · Mar 7, 2022 · 7420158 · 7420158
1 parent c9bfc4b
commit 7420158
Showing 1 changed file with 6 additions and 1 deletion.
diff --git a/scss/_reboot.scss b/scss/_reboot.scss
@@ -87,7 +87,8 @@ body {
 //
 // 1. Default focus state
 // 2. Using the :focus-visible polyfill to hide outline defensively
-// See https://github.com/WICG/focus-visible
+//    See https://github.com/WICG/focus-visible
+// 3. Using the :focus-visible pseudo-class if supported by the browser
 // scss-docs-start focus-visibility
 :focus {
   outline: $outline-width solid; // 1
@@ -97,6 +98,10 @@ body {
 .js-focus-visible .focus:not([data-focus-visible-added]) { // 2
   outline: 0 !important;
 }
+
+:focus:not(:focus-visible) { // 3
+  outline: 0 !important;
+}
 // scss-docs-end focus-visibility
 // End mod