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:
+41
-1
@@ -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>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user