From 4c61952cf1fa0c8c536422f7d82da1642bed4450 Mon Sep 17 00:00:00 2001 From: HomeDash Bot Date: Sat, 12 Sep 2026 20:26:51 +0800 Subject: [PATCH] =?UTF-8?q?fix(ui):=20=E9=A1=B5=E8=84=9A=E6=94=B9=E4=B8=BA?= =?UTF-8?q?=E5=B8=83=E5=B1=80=E4=B8=AD=E7=9A=84=E6=9C=80=E5=90=8E=E4=B8=80?= =?UTF-8?q?=E8=A1=8C=EF=BC=88=E5=8E=BB=E6=8E=89=E6=82=AC=E6=B5=AE=EF=BC=89?= =?UTF-8?q?=EF=BC=8C=E4=B8=89=E8=A7=86=E5=9B=BE=E7=BB=93=E6=9E=84=E4=B8=80?= =?UTF-8?q?=E8=87=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 用户反馈"怎么又变成悬浮在底部了？而且好丑" —— 确认 position:fixed 浮层不可接受。 本版在源码处把页脚从浮层改为 body 纵向 flex 的最后一"行"： - minimal/workspace 的 .navi-footer-host: position:static + flex:0 0 auto （内容链 flex:1 min-height:0，内部自行滚动 → 页脚常驻视口底部但不覆盖内容） - workspace 页脚不再参与 0.55 半透明渐隐、不再 translateY 藏匿 - 删除为"固定页脚"预留的 margin/padding（26px / 40px / 96px） - 恢复 v80 的 2×2 网格版式与文字加深（上一版误删） 判据：position 必须为 static（非悬浮）+ 四段文字完整在视口内 + 页面不出现滚动条。 --- web/navi.css | 212 ++++++++++++++++++++++++++++++++++++++++++--------- 1 file changed, 178 insertions(+), 34 deletions(-) diff --git a/web/navi.css b/web/navi.css index 1a326ec..f666ac4 100644 --- a/web/navi.css +++ b/web/navi.css @@ -32,6 +32,27 @@ html[data-theme] #app { width: 100% !important; } +/* v87：工作空间视图同样用"整屏 flex 列"承载页脚 —— 页脚作为最后一行 + （static，非浮层），内容区 flex:1 且可压缩，页面本身不出现滚动条。 */ +html[data-theme][data-navi-view="workspace"] { + height: 100dvh !important; + max-height: 100dvh !important; + overflow: hidden !important; +} +html[data-theme][data-navi-view="workspace"] body { + height: 100dvh !important; + max-height: 100dvh !important; + overflow: hidden !important; +} +html[data-theme][data-navi-view="workspace"] body > #app { + flex: 1 1 auto !important; + min-height: 0 !important; + max-height: none !important; + display: flex !important; + flex-direction: column !important; + overflow: hidden !important; +} + /* Dashy 的 #dashy 默认 min-height:100vh，短页面叠加页脚后必出滚动； 交回内容自然撑高，视口高度由 body 兜住。 */ html[data-theme] #dashy { @@ -823,26 +844,33 @@ html.navi-dark[data-theme] .navi-footer .navi-quote { color: #6b7d95 !important; /* 关键：在布局里为固定页脚预留 26px，内容框不再被盖住 */ html[data-theme] .minimal-home > .item-group-container { - margin-bottom: 26px !important; + margin-bottom: 0 !important; /* v87：页脚不再覆盖内容，无需预留 */ } html[data-theme] .minimal-home > .item-group-container > .minimal-section-inner { padding-bottom: 8px !important; } +/* v87：页脚不再悬浮 —— 改为 body 纵向 flex 的最后一"行"（static）。 + 页面高 100dvh、内容链 flex:1 min-height:0（内部自行滚动）， + 故页脚始终停在视口底部，却不覆盖任何内容、也不遮挡点击。 */ html[data-theme] body:has(.minimal-home) .navi-footer-host { - position: fixed !important; - left: 0 !important; - right: 0 !important; - bottom: 0 !important; - z-index: 3 !important; + position: static !important; + left: auto !important; + right: auto !important; + bottom: auto !important; + top: auto !important; + flex: 0 0 auto !important; + width: 100% !important; + z-index: auto !important; margin: 0 !important; - pointer-events: none; /* 只挡视觉，不挡点击 */ + padding: 0 0 4px !important; + pointer-events: auto !important; } html[data-theme] body:has(.minimal-home) .navi-footer-host > * { pointer-events: auto; /* 内部链接仍可点 */ } /* 内容框为固定页脚让出空间，避免最后一行被备案号压住 */ html[data-theme] .minimal-home > .item-group-container > .minimal-section-inner { - padding-bottom: 96px !important; + padding-bottom: 8px !important; } /* 页签行固定：不参与滚动，也不被压缩 */ @@ -1123,8 +1151,7 @@ html[data-theme] .navi-footer-sep { 搜索球收左边缘、右下角按钮组整组收右边缘、备案号收下边缘， 各留 14px 露出；鼠标移入或点击、聚焦时滑出展开。 */ html[data-theme][data-navi-view="workspace"] .navi-search-bar, -html[data-theme][data-navi-view="workspace"] .navi-dock, -html[data-theme][data-navi-view="workspace"] .navi-footer-host { +html[data-theme][data-navi-view="workspace"] .navi-dock { opacity: .55 !important; transition: transform .26s cubic-bezier(.22, 1, .36, 1), opacity .26s ease !important; animation: none !important; @@ -1141,14 +1168,19 @@ html[data-theme][data-navi-view="workspace"] .navi-dock { transform: translateX(calc(100% + 2px)) !important; } +/* v87：工作空间页脚同样不再悬浮/藏匿 —— 静态行，始终完整可见 */ html[data-theme][data-navi-view="workspace"] .navi-footer-host { - position: fixed !important; - left: 0 !important; - right: 0 !important; - bottom: 0 !important; - z-index: 880 !important; - padding: 0 !important; - transform: translateY(calc(100% - 13px)) !important; + position: static !important; + left: auto !important; + right: auto !important; + bottom: auto !important; + top: auto !important; + z-index: auto !important; + flex: 0 0 auto !important; + width: 100% !important; + padding: 0 0 4px !important; + transform: none !important; + opacity: 1 !important; } /* 展开：悬停 / 聚焦 / 按下 / 搜索已展开 */ @@ -2296,24 +2328,136 @@ html.navi-dark body .navi-search-toggle:hover { background: rgba(148, 163, 184, 3 个 :not() 把该规则抬到 (0,5,4)，反过来压过了页脚规则。 故本版把页脚 host/footer 一并排除出该规则（它们本就是固定定位，不参与压缩链）。 */ -/* ═══ v86：页脚回到文档流（撤掉 v77–v85 的 fixed/static 摇摆）═══ - 经过 v77–v85 反复，结论： - - 用户要的是"页脚属于页面内容、贴在页面最底"，不要悬浮层； - - 我一度改回 fixed 后又觉得"悬浮、丑"，说明 fixed 不符合预期； - - 而 v81 用 :not(:has(...)) 造出的 (0,11,x) static 钉子让后续所有修改失效， - 造成 /workspace 页脚一直被撑出视口 —— 这些实验规则一并撤除。 - 最终形态：页脚静态排在内容流末尾（v76 形态），配合已生效的 v79/v80 - 两列两行版式与 v78 文字加深；内容链末尾不留多余空白。 */ -html[data-theme] .navi-footer-host { - position: static !important; - left: auto !important; right: auto !important; bottom: auto !important; top: auto !important; - z-index: auto !important; margin: 0 !important; padding: 0 !important; - pointer-events: auto !important; width: 100% !important; - height: auto !important; max-height: none !important; +/* ═══ v77：首页/工作台页脚对齐（复核发现的两处真实缺陷）═══ + 实测（1280×720）： + ① `/`：.navi-footer 挂在 Dashy 的