diff --git a/web/navi.css b/web/navi.css index 6404b2b..96cde94 100644 --- a/web/navi.css +++ b/web/navi.css @@ -2361,3 +2361,43 @@ 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: #cbd5e1 !important; } html.navi-dark[data-theme] .navi-footer .navi-quote { color: #94a3b8 !important; } + +/* ═══ v79:页脚改为「左两行备案 / 右两行一言」═══ + 用户要求:左边两行 = 两个备案号;右边两行 = 座右铭两句 + (不念往昔之繁华 / 无谓前路之沧桑)。 + 结构:.navi-footer 内为「备案A、sep、备案B、sep、quote1、quote2」, + 用 grid 两列两行重排: + 第1行:[备案A] [quote1] 第2行:[备案2] [quote2] + grid-auto-flow: column 配合固定两行即可把「前两个 A」放左列、「后两个 quote」放右列。 */ +html[data-theme] body:has(.minimal-home) .navi-footer-host > .navi-footer, +html[data-theme] body:not(:has(.minimal-home)) footer > .navi-footer, +html[data-theme] .navi-footer { + display: grid !important; + grid-template-columns: auto 1fr !important; + grid-template-rows: auto auto !important; + grid-auto-flow: column !important; /* 先填满两行再换列 → 左列=备案两项,右列=一言两项 */ + align-items: center !important; + justify-items: start !important; + column-gap: 12px !important; row-gap: 2px !important; + width: 100% !important; max-width: calc(100vw - 24px) !important; + height: auto !important; max-height: none !important; min-height: 0 !important; + padding: 0 12px !important; + background: transparent !important; border: 0 !important; box-shadow: none !important; + backdrop-filter: none !important; -webkit-backdrop-filter: none !important; + overflow: visible !important; white-space: nowrap !important; +} +/* 右列(一言)靠右对齐;左列(备案)靠左 */ +html[data-theme] body:has(.minimal-home) .navi-footer-host > .navi-footer > .navi-quote, +html[data-theme] body:not(:has(.minimal-home)) footer > .navi-footer > .navi-quote, +html[data-theme] .navi-footer > .navi-quote { + grid-column: 2 !important; justify-self: end !important; + margin: 0 !important; padding: 0 !important; max-width: none !important; + color: #64748b !important; font-style: normal !important; +} +html[data-theme] .navi-footer > a, +html[data-theme] .navi-footer > .navi-footer-sep { grid-column: 1 !important; justify-self: start !important; } +/* 分隔符在网格布局下不再需要(左右列已天然分离) */ +html[data-theme] .navi-footer > .navi-footer-sep { display: none !important; } +/* 页脚容器高度需容纳两行;给内容框留出足够空间 */ +html[data-theme] body:has(.minimal-home) .navi-footer-host { height: auto !important; max-height: none !important; } +html[data-theme] .minimal-home > .item-group-container { margin-bottom: 40px !important; } diff --git a/web/navi.js b/web/navi.js index 904643a..7ef04bb 100644 --- a/web/navi.js +++ b/web/navi.js @@ -713,23 +713,21 @@ document.addEventListener('click', function (e) { }, 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) { + // v79:改为固定座右铭(原实现随机取 hitokoto + 随机兜底,观感"中二"且不可控)。 + // 用户座右铭:「不念往昔之繁华,无谓前路之沧桑」—— 分作两句,分居两行右侧。 + var QUOTE = ['不念往昔之繁华', '无谓前路之沧桑']; + function render() { 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; + // 两行 = 两个分组行内各放右侧一言;此处仅确保元素存在与文案 + QUOTE.forEach(function (line, idx) { + var sp = document.createElement('span'); + sp.className = 'navi-quote' + (idx === 1 ? ' navi-quote-2' : ''); + sp.textContent = line; + f.appendChild(sp); + }); + 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); }); + if (!render()) { var n = 0; var iv = setInterval(function () { n++; if (render() || n > 20) clearInterval(iv); }, 500); } })(); +