From d146bf2b0d49c030b4186e0960804b1f4ac3eb17 Mon Sep 17 00:00:00 2001
From: Tim <nagisa12164@163.com>
Date: Mon, 1 Sep 2025 20:53:06 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=96=B0=E5=A2=9E=E7=B2=BE=E5=93=81icon?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend_nuxt/assets/global.css          |  1 +
 frontend_nuxt/pages/index.vue            |  6 ++++++
 frontend_nuxt/pages/posts/[id]/index.vue | 11 +++++++++++
 3 files changed, 18 insertions(+)

diff --git a/frontend_nuxt/assets/global.css b/frontend_nuxt/assets/global.css
index f8744fb84..8650b3deb 100644
--- a/frontend_nuxt/assets/global.css
+++ b/frontend_nuxt/assets/global.css
@@ -41,6 +41,7 @@
   --twitter-bg-hover: rgb(91, 91, 91);
   --discord-bg: #5865f258;
   --discord-bg-hover: #5865f2b1;
+  --featured-color: rgb(255, 170, 0);
 }
 
 [data-theme='dark'] {
diff --git a/frontend_nuxt/pages/index.vue b/frontend_nuxt/pages/index.vue
index e2be72a60..bab89feb3 100644
--- a/frontend_nuxt/pages/index.vue
+++ b/frontend_nuxt/pages/index.vue
@@ -74,6 +74,7 @@
                 v-else-if="article.type === 'POLL'"
                 class="fa-solid fa-square-poll-vertical poll-icon"
               ></i>
+              <i class="fa-solid fa-star featured-icon"></i>
               {{ article.title }}
             </NuxtLink>
             <NuxtLink class="article-item-description main-item" :to="`/posts/${article.id}`">
@@ -547,11 +548,16 @@ const sanitizeDescription = (text) => stripMarkdown(text)
 
 .pinned-icon,
 .lottery-icon,
+.featured-icon,
 .poll-icon {
   margin-right: 4px;
   color: var(--primary-color);
 }
 
+.featured-icon {
+  color: var(--featured-color);
+}
+
 .article-item-description {
   max-width: 100%;
   margin-top: 10px;
diff --git a/frontend_nuxt/pages/posts/[id]/index.vue b/frontend_nuxt/pages/posts/[id]/index.vue
index b518fef73..336b9fe1c 100644
--- a/frontend_nuxt/pages/posts/[id]/index.vue
+++ b/frontend_nuxt/pages/posts/[id]/index.vue
@@ -15,6 +15,7 @@
         <div class="article-title-container-right">
           <div v-if="status === 'PENDING'" class="article-pending-button">审核中</div>
           <div v-if="status === 'REJECTED'" class="article-block-button">已拒绝</div>
+          <div class="article-featured-button">精品</div>
           <div v-if="closed" class="article-closed-button">已关闭</div>
           <div
             v-if="!closed && loggedIn && !isAuthor && !subscribed"
@@ -957,6 +958,7 @@ onMounted(async () => {
 
 .article-closed-button,
 .article-subscribe-button-text,
+.article-featured-button,
 .article-unsubscribe-button-text {
   white-space: nowrap;
 }
@@ -998,6 +1000,15 @@ onMounted(async () => {
   font-size: 14px;
 }
 
+.article-featured-button {
+  background-color: var(--background-color);
+  color: var(--featured-color);
+  border: 1px solid var(--featured-color);
+  padding: 5px 10px;
+  border-radius: 8px;
+  font-size: 14px;
+}
+
 .article-closed-button {
   background-color: var(--background-color);
   color: gray;