fix(mobile): remove all focus style for link and button (toeverything…

…#8208)
tantanorange · Sep 12, 2024 · 8bf0458 · 8bf0458
1 parent ba81b1a
commit 8bf0458
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 0 deletions.
diff --git a/packages/frontend/component/src/ui/button/button.css.ts b/packages/frontend/component/src/ui/button/button.css.ts
@@ -180,6 +180,10 @@ export const button = style({
       borderRadius: 'inherit',
       boxShadow: `0 0 0 1px ${cssVarV2('layer/insideBorder/primaryBorder')}`,
     },
+    '&[data-mobile=true]:focus-visible::after': {
+      content: 'none',
+      display: 'none',
+    },
   },
 });
 export const content = style({

diff --git a/packages/frontend/component/src/ui/button/button.tsx b/packages/frontend/component/src/ui/button/button.tsx
@@ -162,6 +162,7 @@ export const Button = forwardRef<HTMLButtonElement, ButtonProps>(
           data-size={size}
           data-variant={variant}
           data-no-hover={withoutHover || undefined}
+          data-mobile={environment.isMobileEdition}
           onClick={handleClick}
         >
           <IconSlot

diff --git a/packages/frontend/mobile/src/styles/mobile.css.ts b/packages/frontend/mobile/src/styles/mobile.css.ts
@@ -22,3 +22,10 @@ globalStyle('html', {
   overflowY: 'auto',
   background: cssVarV2('layer/background/secondary'),
 });
+
+globalStyle('a:focus', {
+  outline: 'none',
+});
+globalStyle('button:focus', {
+  outline: 'none',
+});