From 2790310a25536cf33efbeed644d6d401592c5b65 Mon Sep 17 00:00:00 2001
From: nuyue <nuyue@users.noreply.github.com>
Date: Thu, 16 Jul 2026 15:39:18 +0800
Subject: [PATCH] style: simplify announcement bar design, remove gradient
 background

---
 frontend/src/views/user/Home.vue | 29 +++++++----------------------
 1 file changed, 7 insertions(+), 22 deletions(-)

diff --git a/frontend/src/views/user/Home.vue b/frontend/src/views/user/Home.vue
index 98bf8ad..b267cd0 100644
--- a/frontend/src/views/user/Home.vue
+++ b/frontend/src/views/user/Home.vue
@@ -3,7 +3,7 @@
     <!-- 公告区域 -->
     <div class="announcement-bar" v-if="announcements.length">
       <div class="announcement-icon">
-        <el-icon><Bell /></el-icon>
+        <el-icon :size="20"><Bell /></el-icon>
       </div>
       <div class="announcement-content">
         <el-carousel height="32px" direction="vertical" :autoplay="true" :interval="4000" indicator-position="none">
@@ -193,32 +193,17 @@ onMounted(async () => {
 .announcement-bar {
   display: flex;
   align-items: center;
-  gap: 12px;
-  padding: 8px 16px;
-  background: linear-gradient(135deg, rgba(78, 110, 242, 0.15), rgba(124, 92, 252, 0.15));
-  border: 1px solid rgba(78, 110, 242, 0.2);
+  gap: 10px;
+  padding: 10px 16px;
+  background: #2d2d44;
+  border: 1px solid rgba(255, 255, 255, 0.06);
   border-radius: 10px;
   margin-bottom: 16px;
 }
 
 .announcement-icon {
-  width: 28px;
-  height: 28px;
-  border-radius: 6px;
-  background: linear-gradient(135deg, #4e6ef2, #7c5cfc);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: #fff;
+  color: #f59e0b;
   flex-shrink: 0;
-  animation: bell-ring 2s ease-in-out infinite;
-}
-
-@keyframes bell-ring {
-  0%, 100% { transform: rotate(0); }
-  10%, 30% { transform: rotate(10deg); }
-  20%, 40% { transform: rotate(-10deg); }
-  50% { transform: rotate(0); }
 }
 
 .announcement-content {
@@ -229,7 +214,7 @@ onMounted(async () => {
 
 .announcement-text {
   font-size: 14px;
-  color: rgba(255, 255, 255, 0.85);
+  color: rgba(255, 255, 255, 0.75);
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;