From 4bf4b96fa919aaa566259a7c6b6eab637f080120 Mon Sep 17 00:00:00 2001
From: xuhd <hdxu@kland.com.cn>
Date: Wed, 10 Jun 2026 17:06:21 +0800
Subject: [PATCH] feat(notebook): redesign ai-writing header to space-info-only
 glass pill
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

移除品牌"索财笔记"与右侧"这是我的笔记"标签,header 只保留空间信息;
空间徽章重做成玻璃胶囊(渐变图标徽标 + 已连接状态点),高度 44→52px,
顶部加品牌高光线与 hover 微光,延续索财深蓝品牌色阶。

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 .../src/pages/NotebookAIWritingPage.tsx       | 52 +++++++++++--------
 1 file changed, 30 insertions(+), 22 deletions(-)

diff --git a/frontend-web/src/pages/NotebookAIWritingPage.tsx b/frontend-web/src/pages/NotebookAIWritingPage.tsx
index a0d23ac8..8c818d68 100644
--- a/frontend-web/src/pages/NotebookAIWritingPage.tsx
+++ b/frontend-web/src/pages/NotebookAIWritingPage.tsx
@@ -57,37 +57,45 @@ export default function NotebookAIWritingPage() {
 
   return (
     <div className="h-full flex flex-col overflow-hidden">
-      {/* 索财笔记 Header */}
-      <div className="flex items-center gap-3 px-5 h-11 shrink-0 bg-gradient-to-r from-[#1e3a5f] to-[#1a3255] border-b border-[#2a4a70]">
-        {/* 品牌 */}
-        <div className="flex items-center gap-2">
-          <div className="w-6 h-6 rounded-md bg-blue-500 flex items-center justify-center text-white text-xs font-bold shrink-0">
-            索
-          </div>
-          <span className="text-[#e0f0ff] text-sm font-semibold tracking-wide">索财笔记</span>
-        </div>
+      {/* 索财笔记 Header —— 只承载空间信息（品牌 / 右侧标签已移除） */}
+      <div className="relative flex items-center gap-3 px-5 h-[52px] shrink-0 bg-gradient-to-r from-[#1e3a5f] to-[#1a3255] border-b border-[#2a4a70]">
+        {/* 顶部极细品牌高光线 */}
+        <div className="pointer-events-none absolute inset-x-0 top-0 h-px bg-gradient-to-r from-transparent via-[#7fb3e8]/55 to-transparent" />
 
-        {/* 分隔线 */}
-        <div className="w-px h-4 bg-[#2d4f7a]" />
-
-        {/* 空间名称 */}
+        {/* 空间信息：精致玻璃胶囊 */}
         {data?.search_space_id && (
-          <div className="flex items-center gap-1.5">
-            <span className="text-[#7fb3e8] text-xs">空间</span>
-            <span className="text-[#b3d4f5] text-xs font-semibold bg-[#1a3a60] border border-[#2d5080] rounded px-2 py-0.5">
+          <div
+            className="inline-flex h-7 items-center gap-2 rounded-full border border-[#7fb3e8]/30 bg-gradient-to-b from-[#2d5080]/55 to-[#1a3a60]/55 pl-2 pr-3 shadow-[inset_0_1px_0_rgba(255,255,255,0.06),0_1px_2px_rgba(0,0,0,0.18)] backdrop-blur-sm transition-all hover:border-[#7fb3e8]/55 hover:-translate-y-px hover:shadow-[inset_0_1px_0_rgba(255,255,255,0.08),0_2px_10px_-2px_rgba(59,130,246,0.45)]"
+            title={`当前空间：${spaceName ?? data.search_space_id}`}
+          >
+            {/* 图标徽标 */}
+            <span className="flex size-[18px] items-center justify-center rounded-[5px] bg-gradient-to-br from-[#3b82f6] to-[#1d4ed8] shadow-[0_0_0_1px_rgba(127,179,232,0.25),0_2px_6px_-1px_rgba(29,78,216,0.6)]">
+              <svg
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                strokeWidth={2}
+                strokeLinecap="round"
+                strokeLinejoin="round"
+                className="size-[11px] text-[#e0f0ff]"
+              >
+                <polygon points="12 2 2 7 12 12 22 7 12 2" />
+                <polyline points="2 17 12 22 22 17" />
+                <polyline points="2 12 12 17 22 12" />
+              </svg>
+            </span>
+            <span className="text-[11px] font-medium tracking-wide text-[#7fb3e8]">空间</span>
+            <span className="h-3 w-px bg-[#7fb3e8]/25" />
+            <span className="max-w-[200px] truncate text-[12.5px] font-semibold text-[#d6e8fb]">
               {spaceName ?? data.search_space_id}
             </span>
+            {/* 已连接状态点 */}
+            <span className="size-1.5 shrink-0 rounded-full bg-[#4ade80] shadow-[0_0_0_2px_rgba(74,222,128,0.18)]" />
           </div>
         )}
 
         {/* 弹性占位 */}
         <div className="flex-1" />
-
-        {/* 笔记标签 */}
-        <div className="flex items-center gap-1.5 bg-[#0f2840] border border-[#2a4a70] rounded-md px-2.5 py-1">
-          <span className="text-xs">📒</span>
-          <span className="text-[#bfdbfe] text-xs">这是我的笔记</span>
-        </div>
       </div>
 
       {/* 主体 */}