fix(ui): 页脚改为"真正一行 + 布局预留",消除遮挡与裁切(第三次,纠正前两版)

实测故障(1280×720):
  .navi-footer-host y=598 h=123 fixed;.navi-footer 209×93 半透明 + overflow:hidden;
  内容区底=701 → 与页脚重叠约 103px。那块半透明白块既是"灰色遮罩"又挡住底部点击。

与前两次的区别(前两次的错):
- v63:只改字号/背景,页脚仍 113px 高(另有规则撑高),没解决遮挡
- v64:用 height:22px + overflow:hidden 硬压 → **把内容裁掉**(每日一言高 0 不可见)

本版:
- 去掉胶囊(透明/无边框/无模糊/无圆角),内容自然排成一行 → 不靠裁切
- .navi-footer 用 inline-flex + width:max-content + max-width:calc(100vw-16px),
  每日一言 min-width:0 + ellipsis(超长才省略,不会消失)
- **在布局里预留 26px**(.item-group-container margin-bottom:26px),
  内容框不再与固定页脚重叠;内框 padding-bottom 由 96px 降为 8px
- 重新加入每日一言(按天缓存 + 3s 超时 + 内置兜底)
This commit is contained in:
HomeDash Bot
2026-09-12 17:27:38 +08:00
parent cad98c9f11
commit cb0f8111d8
2 changed files with 73 additions and 0 deletions

View File

@ -770,6 +770,57 @@ html[data-theme] .minimal-home > .item-group-container > .minimal-section-inner
内容少的页签下备案号位置就不对(用户反馈"都成这样了")。
让它 fixed 贴底后,内容框自然吃满剩余高度、高度恒定,
备案号位置与内容多少无关。 */
/* ── 页脚:真正的一行 + 不遮挡内容(第三次,这次不裁切) ──
实测故障:页脚 host 高 123px、内部胶囊 209×93 且 overflow:hidden,
与内容区(底 701)重叠约 103px —— 那块半透明白块既像遮罩又挡住点击。
做法:① 去掉胶囊(透明/无边框/无模糊);② 内容就自然排成一行,不设高度裁切;
③ 用 margin-bottom 在布局里**预留**页脚高度,让内容框不与之重叠。 */
html[data-theme] body:has(.minimal-home) .navi-footer-host {
position: fixed !important;
left: 0 !important; right: 0 !important; bottom: 0 !important;
height: 26px !important; max-height: 26px !important;
display: flex !important; align-items: center !important; justify-content: center !important;
padding: 0 !important; margin: 0 !important;
background: transparent !important; border: 0 !important;
box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
pointer-events: none !important;
z-index: 3 !important;
overflow: visible !important;
}
html[data-theme] .navi-footer {
display: inline-flex !important;
align-items: center !important; justify-content: center !important;
gap: 6px !important; flex-wrap: nowrap !important;
width: max-content !important; max-width: calc(100vw - 16px) !important;
height: auto !important; max-height: 22px !important;
padding: 0 8px !important; margin: 0 auto !important;
background: transparent !important; border: 0 !important; border-radius: 0 !important;
box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
font-size: 11px !important; line-height: 1.45 !important;
color: #94a3b8 !important; white-space: nowrap !important;
overflow: visible !important;
}
html[data-theme] .navi-footer a,
html[data-theme] .navi-footer .navi-footer-sep { font-size: 11px !important; color: inherit !important; }
html.navi-dark[data-theme] .navi-footer,
html.navi-dark[data-theme] .navi-footer a,
html.navi-dark[data-theme] .navi-footer .navi-footer-sep { color: #7c8ea6 !important; }
/* 每日一言:可省略但不裁切到不可见 */
html[data-theme] .navi-footer .navi-quote {
min-width: 0 !important; flex: 0 1 auto !important;
overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
color: #b6c2d2 !important; font-style: italic;
max-width: 40vw !important;
}
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;
}
html[data-theme] .minimal-home > .item-group-container > .minimal-section-inner {
padding-bottom: 8px !important;
}
html[data-theme] body:has(.minimal-home) .navi-footer-host {
position: fixed !important;
left: 0 !important;

View File

@ -711,3 +711,25 @@ document.addEventListener('click', function (e) {
}
} catch (_) {}
}, true);
(function installDailyQuote() {
var FALLBACK = ['保持热爱,奔赴山海。','慢慢来,比较快。','今天也要好好吃饭。','把复杂的事做简单。','不着急,一切都会好起来的。','少即是多。','做难而正确的事。'];
function k() { var d = new Date(); return 'navi-quote-' + d.getFullYear() + '-' + (d.getMonth() + 1) + '-' + d.getDate(); }
function fb() { return FALLBACK[Math.floor(Math.random() * FALLBACK.length)]; }
function render(t) {
var f = document.querySelector('.navi-footer'); if (!f) return false;
if (f.querySelector('.navi-quote')) return true;
var sep = document.createElement('span'); sep.className = 'navi-footer-sep'; sep.textContent = '·';
var q = document.createElement('span'); q.className = 'navi-quote'; q.textContent = t;
f.appendChild(sep); f.appendChild(q); return true;
}
function wait(t) { var n = 0; var iv = setInterval(function () { n++; if (render(t) || n > 20) clearInterval(iv); }, 500); }
var t = null; try { t = localStorage.getItem(k()); } catch (e) {}
if (t) { if (!render(t)) wait(t); return; }
var done = false, ctl = (typeof AbortController !== 'undefined') ? new AbortController() : null;
var tm = setTimeout(function () { if (!done && ctl) { try { ctl.abort(); } catch (e) {} } }, 3000);
fetch('https://v1.hitokoto.cn/?encode=text&charset=utf-8', ctl ? { signal: ctl.signal } : {})
.then(function (r) { return r.ok ? r.text() : ''; })
.then(function (x) { done = true; clearTimeout(tm); var v = (x || '').trim().slice(0, 40) || fb(); try { localStorage.setItem(k(), v); } catch (e) {} if (!render(v)) wait(v); })
.catch(function () { done = true; clearTimeout(tm); var v = fb(); if (!render(v)) wait(v); });
})();