From 60aa5c80a5a222e03e92c0df4e638edee00a6a82 Mon Sep 17 00:00:00 2001
From: zdl <3489966805@qq.com>
Date: Tue, 23 Dec 2025 18:29:04 +0800
Subject: [PATCH] =?UTF-8?q?style(EventDetailModal):=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E5=BC=B9=E7=AA=97=20Tab=20=E5=92=8C=E5=85=B3=E9=97=AD=E6=8C=89?=
 =?UTF-8?q?=E9=92=AE=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Tab 颜色方案调整：全部=紫罗兰色，计划=金色，复盘=绿色，系统=蓝色
- 未选中态统一使用银白色主题
- 选中态增强高亮效果（boxShadow、更明显的边框）
- 标题颜色调整为 rgba(255,255,255,0.85)
- 关闭按钮增强可见性：添加背景色、固定尺寸、圆角
- 弹窗背景色与 /home/center 页面保持一致

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .../Center/components/EventDetailModal.less   | 20 +++++++++++---
 .../Center/components/EventDetailModal.tsx    | 27 +++++++++++++------
 2 files changed, 36 insertions(+), 11 deletions(-)

diff --git a/src/views/Center/components/EventDetailModal.less b/src/views/Center/components/EventDetailModal.less
index c376b31f..27eee98b 100644
--- a/src/views/Center/components/EventDetailModal.less
+++ b/src/views/Center/components/EventDetailModal.less
@@ -53,12 +53,26 @@
 
   // 关闭按钮
   .ant-modal-close {
-    color: @color-text-secondary;
+    color: rgba(255, 255, 255, 0.9) !important;
+    top: 16px;
+    right: 16px;
+    width: 32px;
+    height: 32px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 6px;
+    background: rgba(255, 255, 255, 0.1);
     transition: all 0.3s ease;
 
+    .ant-modal-close-x {
+      font-size: 16px;
+      line-height: 1;
+    }
+
     &:hover {
-      color: @color-gold-400;
-      background: rgba(212, 175, 55, 0.1);
+      color: @color-gold-400 !important;
+      background: rgba(212, 175, 55, 0.2);
     }
   }
 
diff --git a/src/views/Center/components/EventDetailModal.tsx b/src/views/Center/components/EventDetailModal.tsx
index 952c1294..1384fefe 100644
--- a/src/views/Center/components/EventDetailModal.tsx
+++ b/src/views/Center/components/EventDetailModal.tsx
@@ -48,7 +48,7 @@ const FILTER_OPTIONS: FilterOption[] = [
     key: 'all',
     label: '全部',
     icon: LayoutGrid,
-    color: 'rgba(255, 255, 255, 0.8)',
+    color: '#9B59B6', // 紫罗兰色，汇总概念用独特色
   },
   {
     key: 'plan',
@@ -177,7 +177,9 @@ export const EventDetailModal: React.FC<EventDetailModalProps> = ({
       onCancel={onClose}
       title={
         <HStack spacing={2}>
-          <Text>{selectedDate?.format('YYYY年MM月DD日') || ''} 的事件</Text>
+          <Text color="rgba(255, 255, 255, 0.85)" fontWeight="500">
+            {selectedDate?.format('YYYY年MM月DD日') || ''} 的事件
+          </Text>
           <Badge
             bg="rgba(212, 175, 55, 0.15)"
             color="#D4AF37"
@@ -197,6 +199,13 @@ export const EventDetailModal: React.FC<EventDetailModalProps> = ({
       className="event-detail-modal"
       rootClassName="event-detail-modal-root"
       styles={{
+        content: {
+          background: 'rgba(15, 15, 26, 0.95)',
+          border: '1px solid rgba(212, 175, 55, 0.2)',
+        },
+        header: {
+          background: 'transparent',
+        },
         body: { paddingTop: 8, paddingBottom: 24 },
       }}
     >
@@ -228,21 +237,23 @@ export const EventDetailModal: React.FC<EventDetailModalProps> = ({
                   key={option.key}
                   size="sm"
                   variant={isActive ? 'solid' : 'ghost'}
-                  bg={isActive ? hexToRgba(option.color, 0.15) : 'transparent'}
-                  color={isActive ? option.color : 'rgba(255, 255, 255, 0.6)'}
+                  bg={isActive ? hexToRgba(option.color, 0.2) : 'rgba(168, 180, 192, 0.05)'}
+                  color={isActive ? option.color : 'rgba(168, 180, 192, 0.6)'}
                   border="1px solid"
-                  borderColor={isActive ? hexToRgba(option.color, 0.4) : 'rgba(255, 255, 255, 0.1)'}
+                  borderColor={isActive ? hexToRgba(option.color, 0.5) : 'rgba(168, 180, 192, 0.15)'}
+                  boxShadow={isActive ? `0 0 12px ${hexToRgba(option.color, 0.3)}` : 'none'}
                   _hover={{
-                    bg: hexToRgba(option.color, 0.1),
+                    bg: hexToRgba(option.color, 0.12),
                     borderColor: hexToRgba(option.color, 0.3),
+                    color: hexToRgba(option.color, 0.9),
                   }}
                   onClick={() => setActiveFilter(option.key)}
                   leftIcon={option.icon ? <Icon as={option.icon} boxSize={3.5} /> : undefined}
                   rightIcon={
                     count > 0 ? (
                       <Badge
-                        bg={isActive ? hexToRgba(option.color, 0.25) : 'rgba(255, 255, 255, 0.1)'}
-                        color={isActive ? option.color : 'rgba(255, 255, 255, 0.5)'}
+                        bg={isActive ? hexToRgba(option.color, 0.3) : 'rgba(168, 180, 192, 0.1)'}
+                        color={isActive ? option.color : 'rgba(168, 180, 192, 0.6)'}
                         fontSize="10px"
                         px={1.5}
                         borderRadius="full"