fix(a11y): not showing ring on button when using mouse

technikhil314 · Sep 26, 2024 · 2dc0eab · 2dc0eab
1 parent 55d965e
commit 2dc0eab
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 6 deletions.
diff --git a/components/buttons/copyLink.vue b/components/buttons/copyLink.vue
@@ -14,9 +14,8 @@
         transform
         rounded-md
         shadow
-        outline-none
         justify-self-end
-        focus:ring-4
+        focus-visible:ring-4
         active:scale-y-75
         hover:scale-105 hover:shadow-lg
         copy-uri-button

diff --git a/components/buttons/nextDiff.vue b/components/buttons/nextDiff.vue
@@ -14,10 +14,9 @@
         bg-gray-300
         border border-gray-800
         rounded-sm
-        outline-none
         dark:border-gray-400 dark:text-white dark:bg-gray-800
         align-center
-        focus:ring-4
+        focus-visible:ring-4
         active:scale-y-75
         hover:scale-105 hover:shadow-lg
       "

diff --git a/components/buttons/prevDiff.vue b/components/buttons/prevDiff.vue
@@ -14,10 +14,9 @@
         bg-gray-300
         border border-gray-800
         rounded-sm
-        outline-none
+        focus-visible:ring-4
         dark:border-gray-400 dark:text-white dark:bg-gray-800
         align-center
-        focus:ring-4
         active:scale-y-75
         hover:scale-105 hover:shadow-lg
       "