Changed focus to focus-visible

emonadeo · May 18, 2021 · 2013736 · 2013736
1 parent 00483fb
commit 2013736
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/src/components/ScalePicker.vue b/src/components/ScalePicker.vue
@@ -109,7 +109,7 @@ export default {
             margin-left: -2px;
         }
 
-        &:focus {
+        &:focus-visible {
             z-index: 4 !important;
         }
     }

diff --git a/src/styles/mixins.scss b/src/styles/mixins.scss
@@ -17,7 +17,7 @@
     transition-duration: 100ms;
     transition-timing-function: ease-in-out;
 
-    &:focus:not(:active) {
+    &:focus-visible {
         background-color: color.$focus;
         color: color.$on-focus;
 
@@ -32,7 +32,7 @@
     transition-duration: 100ms;
     transition-timing-function: ease-in-out;
 
-    &:focus:not(:active) {
+    &:focus-visible {
         outline: none;
         box-shadow: 0 0 0 4px color.$focus;
     }
@@ -61,7 +61,7 @@
     }
 
     &:active,
-    &[selected]:not(:focus) {
+    &[selected]:not(:focus-visible) {
         transform: translate(2px, 2px);
         box-shadow: none;
     }