wait4xandGLM-5.3
7a2880b65d
- 明暗切换：document 级委托（软导航换 DOM 后元素级监听全丢）； E2E 再抓一坑：SVGElement 非 HTMLElement 实例，守卫用 Element 基类 - 图库：#lb 无条件 display:flex 覆盖 UA 隐藏 → 灯箱"永远打开"盖全页； 改 #lb:not([open]) 显式 none；时间戳标题清空；灯箱打磨（切换钮 实底阴影/n/21 计数器/空标题隐藏/原图链接暗底亮蓝） - 评论：site 'wait4x'→'wait4x.online' 对齐 Artalk 服务端（404 根因） - 书评字体：文楷→思源宋（@fontsource 预分片）；文楷降级金句 --font-kai - 数据：21 张照片组修正 street→landscape（迁移器收到内部组 id 的坑） - 新增 tests/e2e.mjs：Playwright 30 项全功能 E2E 验证: node tests/e2e.mjs 30/30 PASS（含软导航后明暗切换回归项） Spec: 2026-10-25_fix-site-polish Co-authored-by: GLM-5.3
44 lines
1.5 KiB
Plaintext
44 lines
1.5 KiB
Plaintext
---
|
||
// Artalk 评论挂载（Phase 0 已部署 @ https://wait4x.online/artalk）
|
||
// 懒加载：进入视口才拉 Artalk.js，长文页不为其付首屏成本
|
||
interface Props {
|
||
pageKey: string; // 评论流键：中英双语页共用同一 slug（评论不分裂）
|
||
pageTitle: string;
|
||
}
|
||
const { pageKey, pageTitle } = Astro.props;
|
||
---
|
||
|
||
<div id="artalk-container" data-page-key={pageKey} data-page-title={pageTitle}></div>
|
||
|
||
<script>
|
||
const el = document.getElementById('artalk-container');
|
||
if (el) {
|
||
const mount = () => {
|
||
if (document.getElementById('artalk-lib')) return initArtalk();
|
||
const s = document.createElement('script');
|
||
s.id = 'artalk-lib';
|
||
s.src = 'https://wait4x.online/artalk/dist/Artalk.js';
|
||
s.onload = initArtalk;
|
||
document.head.appendChild(s);
|
||
};
|
||
const initArtalk = () => {
|
||
const lib = (window as unknown as { Artalk?: { init: (o: object) => void } }).Artalk;
|
||
lib?.init({
|
||
el: '#artalk-container',
|
||
server: 'https://wait4x.online/artalk',
|
||
site: 'wait4x.online', // 须与 Artalk 服务端 site_default 一致（曾因此 404）
|
||
pageKey: el.dataset.pageKey,
|
||
pageTitle: el.dataset.pageTitle,
|
||
locale: 'zh-CN',
|
||
});
|
||
};
|
||
// 进入视口 ~200px 前挂载；无 IO 环境直接挂
|
||
if ('IntersectionObserver' in window) {
|
||
new IntersectionObserver(
|
||
(entries, obs) => { if (entries.some((e) => e.isIntersecting)) { obs.disconnect(); mount(); } },
|
||
{ rootMargin: '200px' }
|
||
).observe(el);
|
||
} else mount();
|
||
}
|
||
</script>
|