fix: ant tag icon default style (#5473)

This commit is contained in:
Netfan 2025-02-04 10:19:39 +08:00 committed by GitHub
parent a832edce0d
commit f8bb396dc4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 25 additions and 4 deletions

View File

@ -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;

View File

@ -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">