update focus style of switch

shopware · Oct 15, 2024 · 3b50452 · 3b50452
1 parent d9bde83
commit 3b50452
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 3 deletions.
diff --git a/.changeset/six-readers-melt.md b/.changeset/six-readers-melt.md
@@ -0,0 +1,5 @@
+---
+"@shopware-ag/meteor-component-library": patch
+---
+
+Update focus style of switch
diff --git a/packages/component-library/src/components/form/mt-switch/mt-switch.vue b/packages/component-library/src/components/form/mt-switch/mt-switch.vue
@@ -368,10 +368,10 @@ export default defineComponent({
       }
     }
 
-    &:focus-within {
+    &:has(:focus-visible) {
       .mt-field__switch-state {
-        border-color: $color-shopware-brand-500;
-        box-shadow: 0 0 4px $color-shopware-brand-500;
+        outline: 2px solid var(--color-border-brand-selected);
+        outline-offset: 2px;
       }
     }
   }