diff options
Diffstat (limited to 'src/components/ToolCard.vue')
-rw-r--r-- | src/components/ToolCard.vue | 12 |
1 files changed, 9 insertions, 3 deletions
diff --git a/src/components/ToolCard.vue b/src/components/ToolCard.vue index d8a0910..c0f8581 100644 --- a/src/components/ToolCard.vue +++ b/src/components/ToolCard.vue @@ -1,6 +1,6 @@ <template> <router-link :to="tool.path"> - <n-card class="tool-card"> + <c-card class="tool-card"> <n-space justify="space-between" align="center"> <n-icon class="icon" size="40" :component="tool.icon" /> <n-space align="center"> @@ -29,7 +29,7 @@ <br /> </n-ellipsis> </div> - </n-card> + </c-card> </router-link> </template> @@ -37,11 +37,14 @@ import type { Tool } from '@/tools/tools.types'; import { useThemeVars } from 'naive-ui'; import { toRefs } from 'vue'; +import { useAppTheme } from '@/ui/theme/themes'; import FavoriteButton from './FavoriteButton.vue'; const props = defineProps<{ tool: Tool & { category: string } }>(); const { tool } = toRefs(props); const theme = useThemeVars(); + +const appTheme = useAppTheme(); </script> <style lang="less" scoped> @@ -50,8 +53,11 @@ a { } .tool-card { + transition: border-color ease 0.5s; + border-width: 2px !important; + &:hover { - border-color: var(--n-color-target); + border-color: v-bind('appTheme.primary.colorHover'); } .icon { |