feat: add plugin logo placeholder (#3784)

This commit is contained in:
RC-CHN
2025-11-26 16:22:11 +08:00
committed by GitHub
parent 06869b4597
commit abc6deb244
2 changed files with 37 additions and 5 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

View File

@@ -9,6 +9,7 @@ import axios from 'axios';
import { pinyin } from 'pinyin-pro';
import { useCommonStore } from '@/stores/common';
import { useI18n, useModuleI18n } from '@/i18n/composables';
import defaultPluginIcon from '@/assets/images/plugin_icon.png';
import { ref, computed, onMounted, reactive, inject, watch } from 'vue';
@@ -939,7 +940,7 @@ watch(marketSearch, (newVal) => {
<v-row style="min-height: 26rem;">
<v-col v-for="plugin in paginatedPlugins" :key="plugin.name" cols="12" md="6" lg="4">
<v-card class="rounded-lg d-flex flex-column" elevation="0"
<v-card class="rounded-lg d-flex flex-column plugin-card" elevation="0"
style=" height: 12rem; position: relative;">
<!-- 推荐标记 -->
@@ -950,8 +951,8 @@ watch(marketSearch, (newVal) => {
<v-card-text
style="padding: 12px; padding-bottom: 8px; display: flex; gap: 12px; width: 100%; flex: 1; overflow: hidden;">
<div v-if="plugin?.logo" style="flex-shrink: 0;">
<img :src="plugin.logo" :alt="plugin.name"
<div style="flex-shrink: 0;">
<img :src="plugin?.logo || defaultPluginIcon" :alt="plugin.name"
style="height: 75px; width: 75px; border-radius: 8px; object-fit: cover;" />
</div>
@@ -986,8 +987,7 @@ watch(marketSearch, (newVal) => {
</div>
<!-- Description -->
<div class="text-caption"
style="overflow: scroll; color: rgba(var(--v-theme-on-surface), 0.6); line-height: 1.3; margin-bottom: 6px; flex: 1;">
<div class="text-caption plugin-description">
{{ plugin.desc }}
</div>
@@ -1246,4 +1246,36 @@ watch(marketSearch, (newVal) => {
border-radius: 5px;
background-color: #f5f5f5;
}
.plugin-description {
color: rgba(var(--v-theme-on-surface), 0.6);
line-height: 1.3;
margin-bottom: 6px;
flex: 1;
overflow-y: hidden;
}
.plugin-card:hover .plugin-description {
overflow-y: auto;
}
.plugin-description::-webkit-scrollbar {
width: 8px;
height: 8px;
}
.plugin-description::-webkit-scrollbar-track {
background: transparent;
}
.plugin-description::-webkit-scrollbar-thumb {
background-color: rgba(var(--v-theme-primary-rgb), 0.4);
border-radius: 4px;
border: 2px solid transparent;
background-clip: content-box;
}
.plugin-description::-webkit-scrollbar-thumb:hover {
background-color: rgba(var(--v-theme-primary-rgb), 0.6);
}
</style>