From c59a555a2d24e01ad3d97b3d573940021ace5ab7 Mon Sep 17 00:00:00 2001
From: jxxghp <jxxghp@gmail.com>
Date: Sat, 13 Jun 2026 18:03:26 +0800
Subject: [PATCH] feat: enhance plugin tags display with improved styling and
 layout

---
 src/components/cards/PluginAppCard.vue | 26 ++++++++++++++++++++++++--
 1 file changed, 24 insertions(+), 2 deletions(-)

diff --git a/src/components/cards/PluginAppCard.vue b/src/components/cards/PluginAppCard.vue
index fe6d046b..fd09b663 100644
--- a/src/components/cards/PluginAppCard.vue
+++ b/src/components/cards/PluginAppCard.vue
@@ -177,14 +177,14 @@ const dropdownItems = ref([
                   {{ props.plugin?.plugin_desc }}
                 </div>
                 <!-- 插件标签 -->
-                <div v-if="pluginLabels.length > 0" class="plugin-app-card__tags-section px-2">
+                <div v-if="pluginLabels.length > 0" class="plugin-app-card__tags-section px-2 mb-2">
                   <VChip
                     v-for="tag in pluginLabels"
                     :key="tag"
                     size="x-small"
                     variant="tonal"
                     color="info"
-                    class="me-1 mb-1"
+                    class="plugin-app-card__tag"
                     tile
                   >
                     {{ tag }}
@@ -246,3 +246,25 @@ const dropdownItems = ref([
     </VHover>
   </div>
 </template>
+
+<style scoped>
+.plugin-app-card__tags-section {
+  display: flex;
+  overflow: hidden;
+  flex-wrap: nowrap;
+  gap: 4px;
+  max-inline-size: 100%;
+}
+
+.plugin-app-card__tag {
+  flex: 0 0 auto;
+  max-inline-size: 100%;
+  min-inline-size: 0;
+}
+
+.plugin-app-card__tag :deep(.v-chip__content) {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+</style>