fix(ConnectModal): solve plugin tag hover style display unexpected is…

…sue (#861) * fix: pluginTag的错误hover * chore: changeset * Update .changeset/fresh-pugs-kick.md * fix: optimize PluginTag hover style --------- Co-authored-by: jrr997 <zackchangjx@foxmail.com> Co-authored-by: kiner-tang <1127031143@qq.com>
ant-design · May 10, 2024 · da09f06 · da09f06
1 parent a4bdad7
commit da09f06
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 3 deletions.
diff --git a/.changeset/fresh-pugs-kick.md b/.changeset/fresh-pugs-kick.md
@@ -0,0 +1,5 @@
+---
+"@ant-design/web3": patch
+---
+
+fix: ConnectModal PluginTag hover error
diff --git a/packages/web3/src/connect-modal/style/index.tsx b/packages/web3/src/connect-modal/style/index.tsx
@@ -174,9 +174,23 @@ const getThemeStyle = (token: ConnectModalToken): CSSInterpolation => {
                     },
                     '&:hover': {
                       background: token.hoverBg,
-                      [`${componentCls}-plugin-tag:not(:disabled)`]: {
-                        color: token.colorPrimary,
-                        borderColor: token.colorPrimary,
+                      [`&:has(${componentCls}-qr-btn:not(:hover))`]: {
+                        [`${componentCls}-plugin-tag:not(:disabled)`]: {
+                          color: token.colorPrimary,
+                          borderColor: token.colorPrimary,
+                        },
+                      },
+                      [`&:not(:has(${componentCls}-plugin-tag))`]: {
+                        [`${componentCls}-qr-btn`]: {
+                          color: token.colorPrimary,
+                          borderColor: token.colorPrimary,
+                        },
+                      },
+                      [`&:has(${componentCls}-plugin-tag:disabled)`]: {
+                        [`${componentCls}-qr-btn`]: {
+                          color: token.colorPrimary,
+                          borderColor: token.colorPrimary,
+                        },
                       },
                     },
                     '&.selected': {