feat(PluginAppCard, PluginCard): 添加 VSlideYTransition 以增强插件描述的显示效果

This commit is contained in:
jxxghp
2024-12-29 20:18:30 +08:00
parent 4f462c5cfd
commit c6eb744257
2 changed files with 10 additions and 8 deletions
+2 -2
View File
@@ -157,11 +157,11 @@ const dropdownItems = ref([
:style="{ background: `${backgroundColor}`, filter: 'brightness(0.5)' }" :style="{ background: `${backgroundColor}`, filter: 'brightness(0.5)' }"
></div> ></div>
<div class="relative flex-1 min-w-0"> <div class="relative flex-1 min-w-0">
<VCardTitle class="text-white text-lg px-2 text-shadow whitespace-nowrap overflow-hidden text-ellipsis"> <VCardTitle class="text-white text-lg px-2 text-shadow whitespace-nowrap overflow-hidden text-ellipsis ...">
{{ props.plugin?.plugin_name }} {{ props.plugin?.plugin_name }}
<span class="text-sm text-gray-200">v{{ props.plugin?.plugin_version }}</span> <span class="text-sm text-gray-200">v{{ props.plugin?.plugin_version }}</span>
</VCardTitle> </VCardTitle>
<VCardText class="text-white text-sm px-2 py-1 text-shadow line-clamp-3"> <VCardText class="text-white text-sm px-2 py-0 text-shadow overflow-hidden line-clamp-3 ...">
{{ props.plugin?.plugin_desc }} {{ props.plugin?.plugin_desc }}
</VCardText> </VCardText>
</div> </div>
+8 -6
View File
@@ -418,12 +418,14 @@ watch(
{{ props.plugin?.plugin_name }} {{ props.plugin?.plugin_name }}
<span class="text-sm mt-1 text-gray-200">v{{ props.plugin?.plugin_version }}</span> <span class="text-sm mt-1 text-gray-200">v{{ props.plugin?.plugin_version }}</span>
</VCardTitle> </VCardTitle>
<VCardText <VSlideYTransition>
v-show="hover.isHovering || menuVisible" <VCardText
class="px-2 py-1 text-white text-sm text-shadow line-clamp-3" v-show="hover.isHovering || menuVisible"
> class="px-2 py-0 text-white text-sm text-shadow overflow-hidden line-clamp-3 ..."
{{ props.plugin?.plugin_desc }} >
</VCardText> {{ props.plugin?.plugin_desc }}
</VCardText>
</VSlideYTransition>
</div> </div>
<div class="relative flex-shrink-0 self-center"> <div class="relative flex-shrink-0 self-center">
<VAvatar size="64"> <VAvatar size="64">