<script lang="ts" setup>
|
import { VbenIconButton } from '@vben-core/shadcn-ui';
|
|
import { Tooltip } from 'ant-design-vue';
|
|
import { $t } from '#/locales';
|
|
defineProps({
|
isTwinkle: { type: Boolean, default: false },
|
});
|
</script>
|
<template>
|
<Tooltip :mouse-enter-delay="0.5" :title="$t('layout.header.tooltipChat')" placement="bottom">
|
<VbenIconButton class="global-header-icon rounded-md px-[10px]">
|
<i :class="{ twinkle: isTwinkle }" class="icon-ym icon-ym-ai text-[20px] text-foreground"></i>
|
</VbenIconButton>
|
</Tooltip>
|
</template>
|
<style lang="scss" scoped>
|
/* 定义keyframe动画，命名为twinkle */
|
@keyframes twinkle {
|
0% {
|
opacity: 1;
|
}
|
|
50% {
|
opacity: 1;
|
}
|
|
50.01% {
|
opacity: 0;
|
}
|
|
100% {
|
opacity: 0;
|
}
|
}
|
|
.twinkle {
|
animation: twinkle 0.5s linear infinite;
|
}
|
</style>
|
