Make it so that outlines are only shown on keyboard interactions

markteekman · Nov 25, 2021 · 4699319 · 4699319
1 parent 881e4ca
commit 4699319
Showing 1 changed file with 10 additions and 0 deletions.
diff --git a/src/styles/base/_outline.scss b/src/styles/base/_outline.scss
@@ -12,3 +12,13 @@
   -webkit-box-shadow: 0 0 0 2px white;
   box-shadow: 0 0 0 2px white;
 }
+
+*:focus,
+*:focus-visible {
+  @include outline;
+}
+
+*:focus:not(:focus-visible) {
+  outline: none;
+  box-shadow: none;
+}