feat(footer): 页脚加开源/演示/反馈三个外链,新窗口打开 (#4)

- 三个链接:Gitea 仓库、本站演示地址、FeedLite 反馈页(带 ?sw=simple_password)
- 全部 target="_blank" + rel="noopener noreferrer"(防新窗口经 window.opener 反向控制)
- 视觉层级压在 --text-3,hover 才切 --accent,不跟主按钮抢焦点
- ::after 加 ↗ 提示"会跳出本页"
- .foot-links 用 flex + flex-wrap,320px 视口实测不溢出、不换行

回归(全部在 WSL 实跑):
  功能 78/78 · 几何 114/114 · 剪贴板 19/19 · file:// 15/15
  页脚外链 23/23 · 页脚渲染 7/7
  反证 22/22 抓到 · 6/6 抓到

判据不是空靶子(都验过能红):
  - 页脚外链判据对**原始文件**跑 → 9 项失败、退出码 1
  - 页脚渲染判据对**伪造现场**(浅色图冒充 dark)跑 → 2 项失败
This commit is contained in:
2026-11-03 13:26:39 +08:00
parent 9ca33a0328
commit 9b92c1ece1
+41 -1
View File
@@ -873,6 +873,39 @@ input[type="range"]::-moz-range-thumb {
.foot b { color: var(--text-2); font-weight: 550; } .foot b { color: var(--text-2); font-weight: 550; }
.foot .sep { opacity: .45; margin: 0 7px; } .foot .sep { opacity: .45; margin: 0 7px; }
/* 页脚链接区:三个外链,新窗口打开。
刻意压得比正文更淡(继承 .foot 的 text-3),hover 才提亮 ——
页脚不该跟主按钮抢视觉焦点。
::after 的小箭头是"会跳出本页"的提示,也能让截图里一眼看出是新窗口链接。 */
.foot-links {
margin-top: 8px;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: 2px 0;
}
.foot-links a {
color: var(--text-3);
text-decoration: none;
border-radius: 4px;
padding: 2px 3px;
transition: color .15s ease;
white-space: nowrap;
}
.foot-links a:hover,
.foot-links a:focus-visible {
color: var(--accent);
text-decoration: underline;
text-underline-offset: 2px;
}
.foot-links a::after {
content: "↗";
font-size: 10px;
margin-left: 2px;
opacity: .6;
}
.toast { .toast {
position: fixed; position: fixed;
left: 50%; left: 50%;
@@ -1085,7 +1118,14 @@ input[type="range"]::-moz-range-thumb {
</main> </main>
<footer class="foot"> <footer class="foot">
<b>全程本地运算</b><span class="sep">·</span>使用 Web Crypto 密码学安全随机数<span class="sep">·</span>不联网、不上传、不留痕 <span><b>全程本地运算</b><span class="sep">·</span>使用 Web Crypto 密码学安全随机数<span class="sep">·</span>不联网、不上传、不留痕</span>
<nav class="foot-links" aria-label="项目相关链接">
<a href="https://code.yangyq.net/laoyang/simple_password" target="_blank" rel="noopener noreferrer">开源地址</a>
<span class="sep" aria-hidden="true">·</span>
<a href="https://password.yangyq.net/" target="_blank" rel="noopener noreferrer">演示地址</a>
<span class="sep" aria-hidden="true">·</span>
<a href="https://feedlite.yangyq.net/?sw=simple_password" target="_blank" rel="noopener noreferrer">反馈</a>
</nav>
</footer> </footer>
</div> </div>