From 8d5af9799cf3533406fb49d7317c443067a3dda3 Mon Sep 17 00:00:00 2001
From: MT-Mint <798521692@qq.com>
Date: Mon, 13 Apr 2026 17:56:07 +0800
Subject: [PATCH] =?UTF-8?q?style(history-detail):=20=E5=B1=85=E4=B8=AD?=
 =?UTF-8?q?=E6=A0=87=E9=A2=98=E4=B8=8E=E6=A0=87=E7=AD=BE=E6=A0=8F=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 css/history_detail/02-layout/immersive.css    | 26 +++++++++----------
 .../_deprecated/immersive_layout.css          |  9 +++----
 views/history/history_detail.html             |  9 ++++++-
 3 files changed, 24 insertions(+), 20 deletions(-)

diff --git a/css/history_detail/02-layout/immersive.css b/css/history_detail/02-layout/immersive.css
index 5f8c40e..951e557 100644
--- a/css/history_detail/02-layout/immersive.css
+++ b/css/history_detail/02-layout/immersive.css
@@ -98,16 +98,16 @@
 }
 
 /* 标题和 meta 信息合并到一行 */
-#immersive-main-content-area .container > h2 {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
+#immersive-main-content-area .container  #fileName {
+  color: var(--333333, #333);
+font-family: "Microsoft YaHei";
+font-size: 14px;
+font-style: normal;
+font-weight: 700;
+line-height: normal;
   margin: 0;
   padding: 0;
   gap: var(--spacing-md);
-  font-size: 0.7em;
-  font-weight: var(--font-weight-normal);
-  color: var(--color-text-muted);
   flex-shrink: 0; /* 防止被压缩 */
   min-height: 20px; /* 确保最小高度 */
 }
@@ -138,7 +138,7 @@
   display: flex;
   gap: 2px;
   height: 32px;
-  justify-content: flex-start;
+  justify-content: center;
   align-items: center;
   background: transparent;
   border-bottom: 1px solid var(--color-border-light);
@@ -153,7 +153,7 @@
   background-color: transparent;
   border: none;
   border-bottom: 2px solid transparent;
-  color: var(--color-text-muted);
+  color: #999;
   cursor: pointer;
   transition: all var(--transition-fast);
   margin: 0;
@@ -170,9 +170,9 @@
 
 #immersive-main-content-area .tabs-container .tab-btn.active {
   background-color: transparent;
-  color: var(--color-primary);
-  border-bottom-color: var(--color-primary);
-  font-weight: var(--font-weight-semibold);
+  color: #000F33;
+  border-bottom-color: #000F33;
+  /* font-weight: var(--font-weight-semibold); */
 }
 
 /* ==================== 4. 滚动容器管理（核心重构）==================== */
@@ -399,7 +399,7 @@ body.immersive-active #immersive-main-content-area .container .tab-content {
   overflow: hidden !important;
   display: flex;
   flex-direction: column;
-  background: var(--color-bg-secondary) !important;
+  /* background: var(--color-bg-secondary) !important; */
   border: none !important;
   transition: all var(--transition-base) ease !important;
 }
diff --git a/css/history_detail/_deprecated/immersive_layout.css b/css/history_detail/_deprecated/immersive_layout.css
index a1bf4f4..80f894c 100644
--- a/css/history_detail/_deprecated/immersive_layout.css
+++ b/css/history_detail/_deprecated/immersive_layout.css
@@ -61,10 +61,7 @@
 }
 
 /* 将标题和 meta 信息合并到一行 */
-#immersive-main-content-area .container > h2 {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
+#immersive-main-content-area .container  #fileName {
   margin: 0;
   padding: 0;
   gap: 12px;
@@ -289,7 +286,7 @@
   overflow: hidden !important;
   display: flex;
   flex-direction: column;
-  background: var(--immersive-surface-bg) !important;
+  /* background: var(--immersive-surface-bg) !important; */
   border: none !important;
   transition: all var(--immersive-transition-duration) ease !important;
 }
@@ -631,7 +628,7 @@ body.toc-dock-resizing #toc-vs-dock-resize-handle::before {
 }
 
 /* 第一行：h2 和 meta 在同一行 - 极简设计 */
-#immersive-main-content-area .container > h2 {
+#immersive-main-content-area .container  h2 {
   grid-row: 1;
   grid-column: 1;
   height: 24px;
diff --git a/views/history/history_detail.html b/views/history/history_detail.html
index 62eec76..9abe1b4 100644
--- a/views/history/history_detail.html
+++ b/views/history/history_detail.html
@@ -128,6 +128,10 @@
           display: flex !important;
         }
       }
+      .title-container{
+        display: flex;
+        justify-content: center;
+      }
     </style>
     <script>
       // 在 DOM 解析前就添加类，避免闪烁
@@ -433,7 +437,9 @@
         <!-- 主内容容器 -->
         <!-- ===================== -->
         <div class="container">
-          <h2 id="fileName">历史详情</h2>
+          <div class="title-container">
+            <span id="fileName" style="display:block !important;">历史详情</span>
+          </div>
           <div class="meta" id="fileMeta">
             <div class="meta-info">
               <!-- <span id="fileMetaTime"></span>
@@ -451,6 +457,7 @@
               <span>导出</span>
             </button>
           </div>
+          <hr style="margin: 0; height: 1px;" />
 
           <!-- 标签页导航 -->
           <div class="tabs-container">