jianf/HomeDash
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix(ui): 页脚固定 20px 行盒消除 1-2px 裁切；底部按钮改中性亮面不再显灰

Browse Source 
- v67 遗留：.navi-footer 高 26px 但 scrollHeight 超出 clientHeight 1-2px（下缘被切）。
  改为 20/20/20 + line-height:20px + overflow:visible，单行行盒不再溢出。
- 浅色主题下 .navi-view-toggle/.navi-admin-entry 底色 rgba(255,255,255,.72)
  叠在浅背景上观感发灰 → 改 0.92 亮面 + 中性描边 + 柔投影，hover 纯白，
  focus-visible 用中性色轮廓（不引入蓝色）。深色主题规则不变。
- 视图切换保持点开弹菜单（用户明确选择），未改动其交互。
This commit is contained in:
HomeDash Bot
2026-09-12 17:42:51 +08:00
parent e84d51f747
commit 65138f7d83
1 changed files with 40 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
web/navi.css
View File

@ -2153,3 +2153,43 @@ html[data-theme] .navi-footer .navi-quote {
max-width: 40vw !important; color: #b6c2d2 !important; font-style: italic;
}
html.navi-dark[data-theme] .navi-footer .navi-quote { color: #6b7d95 !important; }
/* ═══ v68：页脚不再裁切 + 底部按钮不再显灰（仍为文件末尾，级联必胜）═══
v67 遗留：.navi-footer 实测 26px 而 scrollHeight > clientHeight+1（裁切 1-2px）。
改用固定行高 20px（单行行盒），高度 20/20/20，overflow:visible → 无裁切。
另：浅色主题下按钮底色 rgba(255,255,255,.72) 叠在浅背景上发灰，
改为更亮的玻璃面 + 中性描边（不引入蓝色，深色主题保持原样）。 */
html[data-theme] .navi-footer,
html[data-theme] body .navi-footer {
height: 20px !important; min-height: 20px !important; max-height: 20px !important;
line-height: 20px !important;
overflow: visible !important;
}
html[data-theme] .navi-footer .navi-quote {
line-height: 20px !important; height: 20px !important;
min-height: 0 !important; max-height: 20px !important;
display: inline-block !important; vertical-align: top !important;
}
html[data-theme] .navi-footer a,
html[data-theme] .navi-footer .navi-footer-sep { line-height: 20px !important; }
/* 底部悬浮按钮：中性亮面，不再是"灰块" */
html[data-theme]:not(.navi-dark) .navi-view-toggle,
html[data-theme]:not(.navi-dark) .navi-admin-entry,
html[data-theme]:not(.navi-dark) .navi-search-toggle {
background: rgba(255, 255, 255, 0.92) !important;
border: 1px solid rgba(100, 116, 139, 0.22) !important;
color: #334155 !important;
box-shadow: 0 6px 20px rgba(15, 23, 42, 0.10) !important;
}
html[data-theme]:not(.navi-dark) .navi-view-toggle:hover,
html[data-theme]:not(.navi-dark) .navi-admin-entry:hover,
html[data-theme]:not(.navi-dark) .navi-search-toggle:hover {
background: #ffffff !important;
border-color: rgba(71, 85, 105, 0.34) !important;
}
html[data-theme]:not(.navi-dark) .navi-view-toggle:focus-visible,
html[data-theme]:not(.navi-dark) .navi-admin-entry:focus-visible {
outline: 2px solid rgba(71, 85, 105, 0.55) !important;
outline-offset: 2px !important;
}