diff --git a/HANDOFF.md b/HANDOFF.md index a3738c6..0761ba1 100644 --- a/HANDOFF.md +++ b/HANDOFF.md @@ -167,7 +167,7 @@ GET /api/backup SQLite 快照附件 需登录 - 当前 `PRAGMA user_version = 22`;`schema::migrate` 逐级升级:0 建全量、15→16→17→18→19→20→21→22、更高版本拒绝启动。 - 格式在 `entry.format`(apps / posters / articles),同组可混合;`node` 的旧 `view_mode` 仅保留兼容,不再决定渲染。 - `settings.sidebar.show_profile / show_service` 控制侧栏两张卡片显隐(默认 true)。 -- 首页滚动:`#page-scroll`(Layout 的 body)是唯一滚动容器,搜索框固定在其上方;左右两栏顶部对齐,左侧到底后通过 `translateY` 吸底,右侧继续滚动;滚动条隐藏;顶部没有遮罩,页头与搜索框半透明。 +- 首页滚动:`#page-scroll`(Layout 的 body)是唯一滚动容器,搜索框固定在其上方;左右两栏顶部对齐,左侧到底后通过 `translateY` 吸底,右侧继续滚动;滚动条隐藏;页头实底,搜索位于独立的 28% 半透明 top-dock 块中。 - 本地服务是运行时卡片,但 `card` 表里有一行 `local-service` 只用于排序;内容来自 `/api/projects`,后端禁止删除/改名/配置分组。 - `node` 是统一分组树(根节点 `kind='section'`,子节点 `kind='group'` 可多层);`enabled` 控制启停;`icon` 可为空。 - 主要表:`node`、`entry`、`entry_tag`、`section_block`、`admin`、`session`、`setting`、`audit`。 diff --git a/docs/ADMIN-PLAN.md b/docs/ADMIN-PLAN.md index 9c936d4..6253025 100644 --- a/docs/ADMIN-PLAN.md +++ b/docs/ADMIN-PLAN.md @@ -147,6 +147,14 @@ DELETE /api/items/:id ## 11. 实施记录 +### P24(2026-10-31,独立的半透明顶部块) + +- 页头恢复实底(`headerVariant="solid"`),去掉 `.app > header` 的透明度覆盖; +- 页头下方新增独立 `.top-dock`:`position: fixed; top:60px; height:88px`,背景 28% 页面色 + `blur(10px)` + 半透明底边,作为承载搜索框的单独块,而不是让整条看起来像背景填充; +- 搜索框保持 60% 半透明; +- 背景图渐隐层恢复 80%(撤掉上一轮为露出背景做的 65%); +- 验证:dock top=60、height=88、alpha=0.28;header 纯白;搜索框可见;无 mask 元素。 + ### P23(2026-10-31,去掉遮罩、顶部透明) - 删除 `scroll-fade` 整条遮罩及创建逻辑,页面不再有顶部渐隐/模糊层; diff --git a/stash-web/src/App.css b/stash-web/src/App.css index a5edd02..809f2ac 100644 --- a/stash-web/src/App.css +++ b/stash-web/src/App.css @@ -27,7 +27,7 @@ right: 0; bottom: 0; left: 0; - height: 65%; + height: 80%; background: linear-gradient(to bottom, transparent, var(--su-bg-page)); } @@ -149,17 +149,26 @@ box-shadow: var(--su-shadow-card); } +/* 页头下方独立的一条顶部块:承载搜索框,半透明 */ +.top-dock { + position: fixed; + top: 60px; + right: 0; + left: 0; + z-index: 0; + height: 88px; + pointer-events: none; + background-color: color-mix(in srgb, var(--su-bg-page) 28%, transparent); + backdrop-filter: blur(10px); + border-bottom: 1px solid color-mix(in srgb, var(--su-border) 35%, transparent); +} + /* 搜索框半透明,顶部区域透出背景 */ .search-row > *:first-child { background-color: color-mix(in srgb, var(--su-bg-card) 60%, transparent); backdrop-filter: blur(10px); } -/* 首页页头更透明,让背景图透出来 */ -.app > header { - background-color: color-mix(in srgb, var(--su-bg-page) 55%, transparent); -} - /* ---------- 两栏骨架 ---------- */ .content { diff --git a/stash-web/src/AppNext.tsx b/stash-web/src/AppNext.tsx index 0850f8a..066d0c4 100644 --- a/stash-web/src/AppNext.tsx +++ b/stash-web/src/AppNext.tsx @@ -592,6 +592,7 @@ export default function AppNext() { />