From 834ae67c05c7b9ab06d148cf0d8cc77da152f012 Mon Sep 17 00:00:00 2001
From: Netfan <netfan@foxmail.com>
Date: Tue, 4 Feb 2025 10:00:43 +0800
Subject: [PATCH] fix: ant tag icon default style

---
 packages/styles/src/antd/index.css            | 14 ++++++++++++--
 playground/src/views/examples/tippy/index.vue | 15 +++++++++++++--
 2 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/packages/styles/src/antd/index.css b/packages/styles/src/antd/index.css
index 04dc607d0bf..4dec637ff16 100644
--- a/packages/styles/src/antd/index.css
+++ b/packages/styles/src/antd/index.css
@@ -13,15 +13,25 @@
   }
 
   /* * 修复按钮添加图标时的位置问题 */
-  svg {
+  > svg {
     display: inline-block;
   }
 
-  svg + span {
+  > svg + span {
     margin-inline-start: 6px;
   }
 }
 
+.ant-tag {
+  > svg {
+    display: inline-block;
+  }
+
+  > svg + span {
+    margin-inline-start: 4px;
+  }
+}
+
 .ant-message-notice-content,
 .ant-notification-notice {
   @apply dark:border-border/60 dark:border;
diff --git a/playground/src/views/examples/tippy/index.vue b/playground/src/views/examples/tippy/index.vue
index ff7985ddf40..bfcc3822bc1 100644
--- a/playground/src/views/examples/tippy/index.vue
+++ b/playground/src/views/examples/tippy/index.vue
@@ -4,8 +4,9 @@ import type { TippyProps } from '@vben/common-ui';
 import { reactive } from 'vue';
 
 import { Page, Tippy } from '@vben/common-ui';
+import { ChevronDown } from '@vben/icons';
 
-import { Button, Card, Flex } from 'ant-design-vue';
+import { Button, Card, Flex, Tag } from 'ant-design-vue';
 
 import { useVbenForm } from '#/adapter/form';
 
@@ -254,7 +255,7 @@ function goDoc() {
       <p class="mb-4">
         指令形式使用比较简洁，直接在需要展示tooltip的组件上用v-tippy传递配置，适用于固定内容的工具提示。
       </p>
-      <Flex warp="warp" gap="20">
+      <Flex warp="warp" gap="20" align="center">
         <Button v-tippy="'这是一个提示，使用了默认的配置'">默认配置</Button>
 
         <Button
@@ -277,8 +278,18 @@ function goDoc() {
             animation: 'scale',
           }"
         >
+          <template #icon>
+            <ChevronDown class="size-4" />
+          </template>
           指定动画
         </Button>
+        <Tag color="#f50">
+          <template #icon>
+            <ChevronDown class="size-4" />
+          </template>
+
+          默认配置
+        </Tag>
       </Flex>
     </Card>
     <Card title="组件形式使用" class="mt-4">