From 5747ebc612be470bc61e5aa8b2d346668f406e05 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=85=AC=E6=98=8E?=
 <83812544+Ed1s0nZ@users.noreply.github.com>
Date: Wed, 29 Jul 2026 11:42:23 +0800
Subject: [PATCH] Add files via upload

---
 web/static/css/style.css | 21 +++++++++++++++++++++
 web/static/js/skills.js  |  7 +++++++
 2 files changed, 28 insertions(+)

diff --git a/web/static/css/style.css b/web/static/css/style.css
index d95cadf3..b13b449d 100644
--- a/web/static/css/style.css
+++ b/web/static/css/style.css
@@ -30350,6 +30350,27 @@ html[data-theme="dark"] .skills-management-page .skill-card-actions .btn-seconda
     line-height: 1.45;
 }
 
+.skills-management-page .skill-card-tags {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 6px;
+    margin-top: 2px;
+}
+
+.skills-management-page .skill-card-tags span {
+    max-width: 160px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    padding: 2px 7px;
+    border-radius: 999px;
+    border: 1px solid rgba(15, 23, 42, 0.1);
+    background: rgba(15, 23, 42, 0.04);
+    color: var(--text-secondary);
+    font-size: 0.72rem;
+    line-height: 1.3;
+}
+
 .skills-management-page .skill-card-actions {
     display: flex;
     grid-column: auto;
diff --git a/web/static/js/skills.js b/web/static/js/skills.js
index 9d1805c3..ec0e66ce 100644
--- a/web/static/js/skills.js
+++ b/web/static/js/skills.js
@@ -168,6 +168,12 @@ function renderSkillsList() {
             ? _t('skills.cardFiles', { count: skill.file_count })
             : '';
         const metaItems = [ver, fc, sc].filter(Boolean);
+        const tags = Array.isArray(skill.tags) ? skill.tags.filter(Boolean) : [];
+        const visibleTags = tags.slice(0, 4);
+        const hiddenTagCount = Math.max(0, tags.length - visibleTags.length);
+        const tagsHtml = visibleTags.length
+            ? `<div class="skill-card-tags">${visibleTags.map(tag => `<span>${escapeHtml(tag)}</span>`).join('')}${hiddenTagCount ? `<span>+${hiddenTagCount}</span>` : ''}</div>`
+            : '';
         return `
             <div class="skill-card">
                 <div class="skill-card-body">
@@ -177,6 +183,7 @@ function renderSkillsList() {
                             ${metaItems.length ? `<div class="skill-card-meta">${metaItems.map(item => `<span>${escapeHtml(item)}</span>`).join('')}</div>` : ''}
                         </div>
                         <div class="skill-card-description">${escapeHtml(skill.description || _t('skills.noDescription'))}</div>
+                        ${tagsHtml}
                     </div>
                     <div class="skill-card-actions">
                         <button type="button" class="btn-secondary btn-small" data-skill-view="${escapeHtml(sid)}">${_t('common.view')}</button>