feat: don't show outline unless focused by keyboard

penumbra-zone · Nov 25, 2024 · 00fd43f · 00fd43f
1 parent 29ceb15
commit 00fd43f
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/.changeset/dull-dolphins-sell.md b/.changeset/dull-dolphins-sell.md
@@ -0,0 +1,5 @@
+---
+'@penumbra-zone/ui': minor
+---
+
+Only display tab outline when focused via keyboard, not otherwise.
diff --git a/packages/ui/src/Tabs/index.tsx b/packages/ui/src/Tabs/index.tsx
@@ -101,7 +101,7 @@ export const Tabs = ({ value, onChange, options, actionType = 'default' }: TabsP
                   value === option.value ? 'text-text-primary' : 'text-text-secondary',
                   getDensityItemClasses(density),
                   getFocusOutlineColorByActionType(actionType),
-                  'focus:outline focus:outline-2',
+                  'focus-visible:outline focus-visible:outline-2',
                   'hover:bg-action-hoverOverlay',
                 )}
               >