From 8bf0458ef47026582b72f6fd3e213ac47b8329c4 Mon Sep 17 00:00:00 2001
From: CatsJuice <wp1298554944@hotmail.com>
Date: Thu, 12 Sep 2024 03:07:31 +0000
Subject: [PATCH] fix(mobile): remove all focus style for link and button
 (#8208)

---
 packages/frontend/component/src/ui/button/button.css.ts | 4 ++++
 packages/frontend/component/src/ui/button/button.tsx    | 1 +
 packages/frontend/mobile/src/styles/mobile.css.ts       | 7 +++++++
 3 files changed, 12 insertions(+)

diff --git a/packages/frontend/component/src/ui/button/button.css.ts b/packages/frontend/component/src/ui/button/button.css.ts
index 94d19739ef..19452b46d8 100644
--- 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
index ed25560e3e..cbccad7054 100644
--- 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
index 0c00a2ea5e..436be23d78 100644
--- 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',
+});