style: chage color when hover on statistics label of StationCard

This commit is contained in:
yangsy
2025-08-18 12:20:04 +08:00
parent 4e14eb3590
commit b6ed3dabca

View File

@@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { NCard, NStatistic, NTag, NGrid, NGi, NButton, NIcon } from 'naive-ui'; import { NCard, NStatistic, NTag, NGrid, NGi, NButton, NIcon, useThemeVars } from 'naive-ui';
import { Video } from '@vicons/carbon'; import { Video as VideoIcon } from '@vicons/carbon';
import { toRefs, computed, ref } from 'vue'; import { toRefs, computed, ref } from 'vue';
import axios from 'axios'; import axios from 'axios';
import OfflineDeviceTreeModal from './offline-device-tree-modal.vue'; import OfflineDeviceTreeModal from './offline-device-tree-modal.vue';
@@ -74,6 +74,8 @@ const openVideoPlatform = async () => {
window.$message.error('获取视频平台URL失败'); window.$message.error('获取视频平台URL失败');
} }
}; };
const theme = useThemeVars();
</script> </script>
<template> <template>
@@ -89,7 +91,7 @@ const openVideoPlatform = async () => {
<template #default> <template #default>
<NButton text @click="openVideoPlatform"> <NButton text @click="openVideoPlatform">
<NIcon> <NIcon>
<Video /> <VideoIcon />
</NIcon> </NIcon>
</NButton> </NButton>
<NGrid :cols="2" :style="{ opacity: online ? '1' : '0.3' }"> <NGrid :cols="2" :style="{ opacity: online ? '1' : '0.3' }">
@@ -131,6 +133,11 @@ const openVideoPlatform = async () => {
.clickable { .clickable {
text-decoration: underline dashed; text-decoration: underline dashed;
cursor: pointer; cursor: pointer;
transition: color 0.2s ease;
&:hover {
color: v-bind('theme.infoColorHover');
}
} }
.font-xx-small { .font-xx-small {