fix(v1.2.2): 移动端二级菜单/页脚遮挡/切换不同步/卡片边框;新增瞬间详情页;Steam 页适配
- 移动端抽屉菜单:子菜单 th:block 移入 th:each 循环,修复二级菜单从未渲染 - 页脚:去掉 z-index 抬升,overflow-x hidden 改 clip,评论区翻页等弹层不再被遮挡/裁切 - 深浅色切换:页脚渐变背景改为可过渡的 background-color + 遮罩色层,全站同步过渡 - 玻璃卡片:移除与悬浮位移冲突的 backdrop-filter(Chromium 合成层吃掉顶边框), 影响瞬间/友链页/友链圈/订阅页卡片;瞬间卡悬浮加描边 - 新增瞬间详情页主题化模板 moment.html(卡片视觉/九宫格/点赞恢复/空态兜底/灯箱) - Steam 页:统计数据恒显示并兜底 '-',失败原因提示;成就进度移至右侧并加奖杯标识; 修复容器查询写在被查询元素上导致失效的存量问题 - 评论聚焦环改用 color-mix(var(--accent)),跟随配色;订阅页圆角补兜底 - 已通过 ocr review 全量审查(22 文件),采纳其中有效发现
This commit is contained in:
1 parent
c1b08ad915
commit
cfd9b55a28
24 files changed
+518
-30
No files matched your search
@@ -31,5 +31,6 @@ pnpm-debug.log*
|
|||||||
|
|
||||||
# AI working artifacts
|
# AI working artifacts
|
||||||
llms.txt
|
llms.txt
|
||||||
|
.tmp-*
|
||||||
|
|
||||||
.workbuddy/
|
.workbuddy/
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
@charset "UTF-8";:root{--bg: #faf7f2;--bg-raised: #f3ede5;--bg-overlay: color-mix(in srgb, var(--bg) 85%, transparent);--ink: #2c2420;--ink-2: #7a6e64;--ink-3: #b5a99e;--rule: #e8e0d6;--accent: #d4764e;--accent-hover: #c4613a;--accent-bg: #fdf0e8;--mist-pink: #f0e4de;--sea-salt: #e8e0d6;--caramel: #8b6f5e;--glass-bg: color-mix(in srgb, var(--bg) 72%, transparent);--glass-border: color-mix(in srgb, var(--rule) 50%, transparent);--shadow-sm: 0 1px 3px color-mix(in srgb, var(--ink) 6%, transparent);--shadow-md: 0 4px 16px color-mix(in srgb, var(--ink) 8%, transparent);--shadow-lg: 0 8px 32px color-mix(in srgb, var(--ink) 12%, transparent);--shadow-glow: 0 0 40px color-mix(in srgb, var(--accent) 15%, transparent)}html.dark{--bg: #1e1c1a;--bg-raised: #292623;--bg-overlay: color-mix(in srgb, var(--bg) 85%, transparent);--ink: #e9e4dd;--ink-2: #aaa096;--ink-3: #7c7268;--rule: #3b362f;--accent: #e89a64;--accent-hover: #f2ad79;--accent-bg: #2c231b;--mist-pink: #2e2823;--sea-salt: #302b26;--caramel: #a38b7b;--glass-bg: color-mix(in srgb, var(--bg) 72%, transparent);--glass-border: color-mix(in srgb, var(--rule) 50%, transparent);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .24);--shadow-md: 0 4px 16px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--shadow-glow: 0 0 40px rgba(232, 154, 100, .12)}html[data-palette=matcha]{--bg: #f6f8f1;--bg-raised: #ecf1e3;--ink: #26302a;--ink-2: #6d7a6e;--ink-3: #a8b3a4;--rule: #dde5d4;--accent: #6f9d52;--accent-hover: #5d8943;--accent-bg: #ecf3e2;--mist-pink: #e7eddc;--sea-salt: #dfe8d3;--caramel: #7d8a68}html[data-palette=matcha].dark{--bg: #1b1f1a;--bg-raised: #252b22;--ink: #e6e9e0;--ink-2: #a3ab9c;--ink-3: #767e70;--rule: #363d33;--accent: #9cc47f;--accent-hover: #aed493;--accent-bg: #242c1f;--mist-pink: #262d22;--sea-salt: #282f24;--caramel: #98a387}html[data-palette=indigo]{--bg: #f5f7fa;--bg-raised: #eaeff5;--ink: #232a33;--ink-2: #66707d;--ink-3: #a3adb8;--rule: #dce2ea;--accent: #4a6fa5;--accent-hover: #3d5d8c;--accent-bg: #e9eff8;--mist-pink: #e2e8f0;--sea-salt: #dbe4ee;--caramel: #707c8e}html[data-palette=indigo].dark{--bg: #191d23;--bg-raised: #222831;--ink: #e4e7ec;--ink-2: #9aa4b1;--ink-3: #6d7683;--rule: #323a45;--accent: #7fa3d1;--accent-hover: #93b4dc;--accent-bg: #1f2632;--mist-pink: #232830;--sea-salt: #252b34;--caramel: #8b95a6}html[data-palette=sakura]{--bg: #faf5f6;--bg-raised: #f3eaec;--ink: #322a2c;--ink-2: #7d6e72;--ink-3: #b4a6aa;--rule: #ecdfe2;--accent: #d97387;--accent-hover: #c85d72;--accent-bg: #fbeef1;--mist-pink: #f2e2e6;--sea-salt: #eddfe3;--caramel: #96757e}html[data-palette=sakura].dark{--bg: #201b1c;--bg-raised: #2a2425;--ink: #ece5e6;--ink-2: #b0a4a7;--ink-3: #7f7276;--rule: #3c3436;--accent: #e89aab;--accent-hover: #f0aec0;--accent-bg: #2d2225;--mist-pink: #2f2729;--sea-salt: #31282a;--caramel: #a88d94}html[data-palette=violet]{--bg: #f7f5fa;--bg-raised: #eeeaf5;--ink: #2b2733;--ink-2: #6f6a7c;--ink-3: #aaa5b6;--rule: #e2ddeb;--accent: #8a6fc0;--accent-hover: #7759ae;--accent-bg: #f0eaf9;--mist-pink: #e8e2f0;--sea-salt: #e3dcee;--caramel: #7f7590}html[data-palette=violet].dark{--bg: #1c1a21;--bg-raised: #26222f;--ink: #e8e5ee;--ink-2: #a49eaf;--ink-3: #746e80;--rule: #373241;--accent: #b49ae0;--accent-hover: #c3ace8;--accent-bg: #262033;--mist-pink: #292434;--sea-salt: #2b2536;--caramel: #948caa}html[data-palette=sea]{--bg: #f3f8f7;--bg-raised: #e8f0ee;--ink: #21302d;--ink-2: #647872;--ink-3: #9fb1ac;--rule: #d9e6e3;--accent: #3d9c8f;--accent-hover: #2f8578;--accent-bg: #e5f3f0;--mist-pink: #dee9e6;--sea-salt: #d6e5e1;--caramel: #6c8680}html[data-palette=sea].dark{--bg: #181f1e;--bg-raised: #212a28;--ink: #e3eae8;--ink-2: #9aaba6;--ink-3: #6d7d79;--rule: #2f3b39;--accent: #6cc3b4;--accent-hover: #82d0c2;--accent-bg: #1d2a27;--mist-pink: #222c2a;--sea-salt: #242e2c;--caramel: #869894}html[data-palette=amber]{--bg: #faf7ef;--bg-raised: #f3eddc;--ink: #322b1e;--ink-2: #7d7360;--ink-3: #b5ab94;--rule: #eae1cb;--accent: #b97f1c;--accent-hover: #9f6a0e;--accent-bg: #f9efd8;--mist-pink: #f0e8d2;--sea-salt: #ebe2ca;--caramel: #96835c}html[data-palette=amber].dark{--bg: #201d16;--bg-raised: #2a261d;--ink: #ebe6d9;--ink-2: #b0a893;--ink-3: #7f7866;--rule: #3c3729;--accent: #e0a83e;--accent-hover: #ebba5c;--accent-bg: #2c251a;--mist-pink: #2f2a1e;--sea-salt: #312c20;--caramel: #a89a76}html[data-palette=plum]{--bg: #f9f4f5;--bg-raised: #f1e8ea;--ink: #2f2427;--ink-2: #796a6f;--ink-3: #b1a2a7;--rule: #e9dde0;--accent: #a4506b;--accent-hover: #8d3f59;--accent-bg: #f7e9ee;--mist-pink: #ecdee2;--sea-salt: #e5d8db;--caramel: #8d6f77}html[data-palette=plum].dark{--bg: #1f1a1b;--bg-raised: #292223;--ink: #eae2e4;--ink-2: #ada0a4;--ink-3: #7c6e73;--rule: #3a3133;--accent: #d98aa3;--accent-hover: #e39fb5;--accent-bg: #2b2023;--mist-pink: #2d2527;--sea-salt: #2f2729;--caramel: #a08890}html[data-palette=graphite]{--bg: #f7f7f6;--bg-raised: #eeedeb;--ink: #262626;--ink-2: #6e6e6c;--ink-3: #ababa8;--rule: #e0e0de;--accent: #3f3f3e;--accent-hover: #262626;--accentLine truncated
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
@charset "UTF-8";:root{--bg: #faf7f2;--bg-raised: #f3ede5;--bg-overlay: color-mix(in srgb, var(--bg) 85%, transparent);--ink: #2c2420;--ink-2: #7a6e64;--ink-3: #b5a99e;--rule: #e8e0d6;--accent: #d4764e;--accent-hover: #c4613a;--accent-bg: #fdf0e8;--mist-pink: #f0e4de;--sea-salt: #e8e0d6;--caramel: #8b6f5e;--glass-bg: color-mix(in srgb, var(--bg) 72%, transparent);--glass-border: color-mix(in srgb, var(--rule) 50%, transparent);--shadow-sm: 0 1px 3px color-mix(in srgb, var(--ink) 6%, transparent);--shadow-md: 0 4px 16px color-mix(in srgb, var(--ink) 8%, transparent);--shadow-lg: 0 8px 32px color-mix(in srgb, var(--ink) 12%, transparent);--shadow-glow: 0 0 40px color-mix(in srgb, var(--accent) 15%, transparent)}html.dark{--bg: #1e1c1a;--bg-raised: #292623;--bg-overlay: color-mix(in srgb, var(--bg) 85%, transparent);--ink: #e9e4dd;--ink-2: #aaa096;--ink-3: #7c7268;--rule: #3b362f;--accent: #e89a64;--accent-hover: #f2ad79;--accent-bg: #2c231b;--mist-pink: #2e2823;--sea-salt: #302b26;--caramel: #a38b7b;--glass-bg: color-mix(in srgb, var(--bg) 72%, transparent);--glass-border: color-mix(in srgb, var(--rule) 50%, transparent);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .24);--shadow-md: 0 4px 16px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--shadow-glow: 0 0 40px rgba(232, 154, 100, .12)}html[data-palette=matcha]{--bg: #f6f8f1;--bg-raised: #ecf1e3;--ink: #26302a;--ink-2: #6d7a6e;--ink-3: #a8b3a4;--rule: #dde5d4;--accent: #6f9d52;--accent-hover: #5d8943;--accent-bg: #ecf3e2;--mist-pink: #e7eddc;--sea-salt: #dfe8d3;--caramel: #7d8a68}html[data-palette=matcha].dark{--bg: #1b1f1a;--bg-raised: #252b22;--ink: #e6e9e0;--ink-2: #a3ab9c;--ink-3: #767e70;--rule: #363d33;--accent: #9cc47f;--accent-hover: #aed493;--accent-bg: #242c1f;--mist-pink: #262d22;--sea-salt: #282f24;--caramel: #98a387}html[data-palette=indigo]{--bg: #f5f7fa;--bg-raised: #eaeff5;--ink: #232a33;--ink-2: #66707d;--ink-3: #a3adb8;--rule: #dce2ea;--accent: #4a6fa5;--accent-hover: #3d5d8c;--accent-bg: #e9eff8;--mist-pink: #e2e8f0;--sea-salt: #dbe4ee;--caramel: #707c8e}html[data-palette=indigo].dark{--bg: #191d23;--bg-raised: #222831;--ink: #e4e7ec;--ink-2: #9aa4b1;--ink-3: #6d7683;--rule: #323a45;--accent: #7fa3d1;--accent-hover: #93b4dc;--accent-bg: #1f2632;--mist-pink: #232830;--sea-salt: #252b34;--caramel: #8b95a6}html[data-palette=sakura]{--bg: #faf5f6;--bg-raised: #f3eaec;--ink: #322a2c;--ink-2: #7d6e72;--ink-3: #b4a6aa;--rule: #ecdfe2;--accent: #d97387;--accent-hover: #c85d72;--accent-bg: #fbeef1;--mist-pink: #f2e2e6;--sea-salt: #eddfe3;--caramel: #96757e}html[data-palette=sakura].dark{--bg: #201b1c;--bg-raised: #2a2425;--ink: #ece5e6;--ink-2: #b0a4a7;--ink-3: #7f7276;--rule: #3c3436;--accent: #e89aab;--accent-hover: #f0aec0;--accent-bg: #2d2225;--mist-pink: #2f2729;--sea-salt: #31282a;--caramel: #a88d94}html[data-palette=violet]{--bg: #f7f5fa;--bg-raised: #eeeaf5;--ink: #2b2733;--ink-2: #6f6a7c;--ink-3: #aaa5b6;--rule: #e2ddeb;--accent: #8a6fc0;--accent-hover: #7759ae;--accent-bg: #f0eaf9;--mist-pink: #e8e2f0;--sea-salt: #e3dcee;--caramel: #7f7590}html[data-palette=violet].dark{--bg: #1c1a21;--bg-raised: #26222f;--ink: #e8e5ee;--ink-2: #a49eaf;--ink-3: #746e80;--rule: #373241;--accent: #b49ae0;--accent-hover: #c3ace8;--accent-bg: #262033;--mist-pink: #292434;--sea-salt: #2b2536;--caramel: #948caa}html[data-palette=sea]{--bg: #f3f8f7;--bg-raised: #e8f0ee;--ink: #21302d;--ink-2: #647872;--ink-3: #9fb1ac;--rule: #d9e6e3;--accent: #3d9c8f;--accent-hover: #2f8578;--accent-bg: #e5f3f0;--mist-pink: #dee9e6;--sea-salt: #d6e5e1;--caramel: #6c8680}html[data-palette=sea].dark{--bg: #181f1e;--bg-raised: #212a28;--ink: #e3eae8;--ink-2: #9aaba6;--ink-3: #6d7d79;--rule: #2f3b39;--accent: #6cc3b4;--accent-hover: #82d0c2;--accent-bg: #1d2a27;--mist-pink: #222c2a;--sea-salt: #242e2c;--caramel: #869894}html[data-palette=amber]{--bg: #faf7ef;--bg-raised: #f3eddc;--ink: #322b1e;--ink-2: #7d7360;--ink-3: #b5ab94;--rule: #eae1cb;--accent: #b97f1c;--accent-hover: #9f6a0e;--accent-bg: #f9efd8;--mist-pink: #f0e8d2;--sea-salt: #ebe2ca;--caramel: #96835c}html[data-palette=amber].dark{--bg: #201d16;--bg-raised: #2a261d;--ink: #ebe6d9;--ink-2: #b0a893;--ink-3: #7f7866;--rule: #3c3729;--accent: #e0a83e;--accent-hover: #ebba5c;--accent-bg: #2c251a;--mist-pink: #2f2a1e;--sea-salt: #312c20;--caramel: #a89a76}html[data-palette=plum]{--bg: #f9f4f5;--bg-raised: #f1e8ea;--ink: #2f2427;--ink-2: #796a6f;--ink-3: #b1a2a7;--rule: #e9dde0;--accent: #a4506b;--accent-hover: #8d3f59;--accent-bg: #f7e9ee;--mist-pink: #ecdee2;--sea-salt: #e5d8db;--caramel: #8d6f77}html[data-palette=plum].dark{--bg: #1f1a1b;--bg-raised: #292223;--ink: #eae2e4;--ink-2: #ada0a4;--ink-3: #7c6e73;--rule: #3a3133;--accent: #d98aa3;--accent-hover: #e39fb5;--accent-bg: #2b2023;--mist-pink: #2d2527;--sea-salt: #2f2729;--caramel: #a08890}html[data-palette=graphite]{--bg: #f7f7f6;--bg-raised: #eeedeb;--ink: #262626;--ink-2: #6e6e6c;--ink-3: #ababa8;--rule: #e0e0de;--accent: #3f3f3e;--accent-hover: #262626;--accentLine truncated
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
.wi-links[data-astro-cid-au7rboj5]{padding-block:1rem}.wi-links__header[data-astro-cid-au7rboj5]{text-align:center;margin-bottom:var(--space-3xl)}.wi-links__portal[data-astro-cid-au7rboj5]{display:inline-flex;align-items:center;gap:.375rem;padding:.6rem 1.1rem;min-height:44px;margin-top:var(--space-md);border-radius:9999px;font-size:var(--text-sm);color:#fff;background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 70%,#000));border:none;cursor:pointer;font-family:inherit;font-weight:600;box-shadow:0 2px 8px color-mix(in srgb,var(--accent) 30%,transparent);transition:transform var(--duration-fast) var(--ease-out-quart),box-shadow var(--duration-fast) var(--ease-out-quart),opacity var(--duration-fast) var(--ease-out-quart)}.wi-links__portal[data-astro-cid-au7rboj5]:hover{transform:translateY(-1px);box-shadow:0 4px 14px color-mix(in srgb,var(--accent) 40%,transparent);opacity:.95}.wi-links__portal[data-astro-cid-au7rboj5]:active{transform:translateY(0) scale(.97)}.wi-links__portal[data-astro-cid-au7rboj5] svg[data-astro-cid-au7rboj5]{transition:transform var(--duration-normal) var(--ease-out-expo)}.wi-links__portal[data-astro-cid-au7rboj5]:hover svg[data-astro-cid-au7rboj5]{transform:rotate(180deg) scale(1.1)}.wi-links__comment[data-astro-cid-au7rboj5]{margin-top:var(--space-3xl)}.wi-links__apply[data-astro-cid-au7rboj5]{margin-top:var(--space-3xl);padding:var(--space-xl);border:1px solid var(--rule);border-radius:var(--radius-lg, 16px);background:var(--bg-raised)}.wi-links__apply-title[data-astro-cid-au7rboj5]{text-align:center;font-size:var(--text-xl);font-weight:700;color:var(--ink);margin-bottom:var(--space-lg)}.wi-links__apply-result[data-astro-cid-au7rboj5]{text-align:center;font-size:var(--text-sm);color:var(--accent);margin-bottom:var(--space-md)}.wi-links__apply-result--ok[data-astro-cid-au7rboj5],.wi-links-check-ok[data-astro-cid-au7rboj5]{color:var(--accent)}.wi-links__apply-result--error[data-astro-cid-au7rboj5],.wi-links-check-error[data-astro-cid-au7rboj5]{color:#e6162d}html.dark .wi-links__apply-result--error[data-astro-cid-au7rboj5],html.dark .wi-links-check-error[data-astro-cid-au7rboj5]{color:#ff6b6b}.wi-links__apply-form[data-astro-cid-au7rboj5]{display:flex;flex-direction:column;gap:var(--space-md)}.wi-links__apply-row[data-astro-cid-au7rboj5]{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md)}.wi-links__apply-field[data-astro-cid-au7rboj5]{display:flex;flex-direction:column;gap:.35rem;font-size:var(--text-sm);color:var(--ink-2)}.wi-links__apply-field[data-astro-cid-au7rboj5] input[data-astro-cid-au7rboj5],.wi-links__apply-field[data-astro-cid-au7rboj5] textarea[data-astro-cid-au7rboj5]{padding:.6rem .8rem;border:1px solid var(--rule);border-radius:10px;background:var(--bg);color:var(--ink);font-family:inherit;font-size:var(--text-sm);transition:border-color .15s ease,box-shadow .15s ease;resize:vertical}.wi-links__apply-field[data-astro-cid-au7rboj5] input[data-astro-cid-au7rboj5]:focus,.wi-links__apply-field[data-astro-cid-au7rboj5] textarea[data-astro-cid-au7rboj5]:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent)}.wi-links__apply-captcha[data-astro-cid-au7rboj5]{display:flex;align-items:flex-end;padding-bottom:2px}.wi-links__apply-captcha-img[data-astro-cid-au7rboj5]{border-radius:8px;border:1px solid var(--rule);cursor:pointer}.wi-links__apply-submit[data-astro-cid-au7rboj5]{align-self:center;padding:.65rem 2.2rem;min-height:44px;border:none;border-radius:9999px;font-size:var(--text-sm);font-weight:600;font-family:inherit;color:#fff;background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 70%,#000));cursor:pointer;transition:transform var(--duration-fast) var(--ease-out-quart),opacity .15s ease}.wi-links__apply-submit[data-astro-cid-au7rboj5]:hover{transform:translateY(-1px);opacity:.95}.wi-links__apply-submit[data-astro-cid-au7rboj5]:active{transform:translateY(0) scale(.98)}.wi-links__apply--unavailable[data-astro-cid-au7rboj5] .wi-links__apply-form[data-astro-cid-au7rboj5]{display:none}.wi-links__apply--unavailable[data-astro-cid-au7rboj5] .wi-links__apply-unavailable-tip[data-astro-cid-au7rboj5]{display:block!important;text-align:center;color:var(--ink-3);font-size:var(--text-sm)}@media(max-width:640px){.wi-links__apply-row[data-astro-cid-au7rboj5]{grid-template-columns:1fr}}.wi-links__title[data-astro-cid-au7rboj5]{font-size:var(--text-4xl);margin-bottom:var(--space-xs)}.wi-links__subtitle[data-astro-cid-au7rboj5]{font-size:var(--text-sm);color:var(--ink-3);letter-spacing:var(--tracking-wide);margin-block-end:0}.wi-page-accent[data-astro-cid-au7rboj5]{display:block;width:48px;height:3px;margin:var(--space-md) auto 0;border-radius:9999px;background:var(--accent)}.wi-links__group[data-astro-cid-au7rboj5]{font-size:var(--text-lg);color:var(--ink-2);margin-bottom:var(--space-lg);padding-bottom:var(--space-sm);border-bottom:1px solid var(--rule);font-weight:600}.Line truncated
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
.wi-moment-detail[data-astro-cid-csz2amhe]{padding-block:1rem;max-width:720px;margin:0 auto}.wi-moment-detail__sr-only[data-astro-cid-csz2amhe]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.wi-moment-detail__topbar[data-astro-cid-csz2amhe]{margin-bottom:var(--space-lg)}.wi-moment-detail__back[data-astro-cid-csz2amhe]{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .875rem;border-radius:9999px;font-size:var(--text-sm);color:var(--ink-2);text-decoration:none;background:var(--bg-raised);transition:color var(--duration-fast) var(--ease-out-quart),background var(--duration-fast) var(--ease-out-quart)}.wi-moment-detail__back[data-astro-cid-csz2amhe]:hover{color:var(--accent);background:var(--accent-bg)}.wi-moment-detail__card[data-astro-cid-csz2amhe]{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:16px;padding:var(--space-xl)}.wi-moment-detail__layout[data-astro-cid-csz2amhe]{display:flex;gap:var(--space-md);align-items:flex-start}.wi-moment-detail__avatar[data-astro-cid-csz2amhe]{width:44px;height:44px;border-radius:10px;object-fit:cover;flex-shrink:0;box-shadow:var(--shadow-sm)}.wi-moment-detail__avatar--fallback[data-astro-cid-csz2amhe]{display:flex;align-items:center;justify-content:center;background:var(--accent-bg);color:var(--accent);font-family:var(--font-sans);font-size:var(--text-md);font-weight:700}.wi-moment-detail__main[data-astro-cid-csz2amhe]{flex:1;min-width:0}.wi-moment-detail__head[data-astro-cid-csz2amhe]{display:flex;align-items:baseline;gap:var(--space-sm);flex-wrap:wrap}.wi-moment-detail__name[data-astro-cid-csz2amhe]{font-size:var(--text-md);font-weight:600;color:var(--ink)}.wi-moment-detail__date[data-astro-cid-csz2amhe]{font-size:var(--text-xs);color:var(--ink-3)}.wi-moment-detail__text[data-astro-cid-csz2amhe]{margin-top:var(--space-sm);font-size:var(--text-base);line-height:var(--leading-relaxed);color:var(--ink);word-wrap:break-word;overflow-wrap:break-word}.wi-moment-detail__text[data-astro-cid-csz2amhe] img{max-width:100%;height:auto;border-radius:8px}.wi-moment-detail__media[data-astro-cid-csz2amhe]{margin-top:var(--space-md);display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.wi-moment-detail__media[data-astro-cid-csz2amhe]:has(.wi-moment-detail__image:only-child){grid-template-columns:1fr}.wi-moment-detail__media[data-astro-cid-csz2amhe]:has(.wi-moment-detail__image:only-child) .wi-moment-detail__image[data-astro-cid-csz2amhe]{aspect-ratio:auto;max-height:300px;max-width:400px}.wi-moment-detail__media[data-astro-cid-csz2amhe]:has(.wi-moment-detail__image:nth-child(2):last-child){grid-template-columns:repeat(2,1fr)}.wi-moment-detail__media[data-astro-cid-csz2amhe]:has(.wi-moment-detail__image:nth-child(4)):not(:has(.wi-moment-detail__image:nth-child(5))){grid-template-columns:repeat(2,1fr);max-width:72%}.wi-moment-detail__media[data-astro-cid-csz2amhe]:has(.wi-moment-detail__image:nth-child(3)){max-width:100%}.wi-moment-detail__image[data-astro-cid-csz2amhe]{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;cursor:zoom-in;transition:transform .2s ease}.wi-moment-detail__image[data-astro-cid-csz2amhe]:hover{transform:scale(1.02)}.wi-moment-detail__video[data-astro-cid-csz2amhe]{width:100%;border-radius:8px;display:block}.wi-moment-detail__audio[data-astro-cid-csz2amhe]{width:100%}.wi-moment-detail__actions[data-astro-cid-csz2amhe]{display:flex;align-items:center;gap:var(--space-sm);margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--rule)}.wi-moment-detail__like-btn[data-astro-cid-csz2amhe],.wi-moment-detail__comment-hint[data-astro-cid-csz2amhe]{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .875rem;border:1px solid var(--rule);border-radius:9999px;background:transparent;color:var(--ink-2);font-size:var(--text-xs);transition:color var(--duration-fast) var(--ease-out-quart),border-color var(--duration-fast) var(--ease-out-quart),background var(--duration-fast) var(--ease-out-quart)}.wi-moment-detail__like-btn[data-astro-cid-csz2amhe]{cursor:pointer}.wi-moment-detail__comment-hint[data-astro-cid-csz2amhe]{cursor:default}.wi-moment-detail__like-btn[data-astro-cid-csz2amhe]:hover,.wi-moment-detail__like-btn--liked[data-astro-cid-csz2amhe]{color:var(--accent);border-color:var(--accent);background:var(--accent-bg)}.wi-moment-detail__comments[data-astro-cid-csz2amhe]{margin-top:var(--space-xl)}.wi-moment-detail__empty[data-astro-cid-csz2amhe]{text-align:center;padding:var(--space-4xl) var(--space-xl);color:var(--ink-3)}@media(max-width:640px){.wi-moment-detail__card[data-astro-cid-csz2amhe]{padding:var(--space-lg)}.wi-moment-detail__avatar[data-astro-cid-csz2amhe]{width:38px;height:38px}}
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
.wi-moments-page[data-astro-cid-ovd5htye]{padding-block:1rem}.wi-moments-page__hero[data-astro-cid-ovd5htye]{position:relative;width:100%;height:clamp(220px,30vw,380px);margin-bottom:var(--space-2xl);overflow:hidden;background:var(--bg-raised)}.wi-moments-page__cover[data-astro-cid-ovd5htye]{width:100%;height:100%;object-fit:cover;display:block}.wi-moments-page__header[data-astro-cid-ovd5htye]{text-align:center;margin-bottom:var(--space-3xl)}.wi-moments-page__title[data-astro-cid-ovd5htye]{font-size:var(--text-4xl);margin-bottom:var(--space-sm)}.wi-page-accent[data-astro-cid-ovd5htye]{display:block;width:48px;height:3px;margin:var(--space-sm) auto 0;border-radius:9999px;background:var(--accent)}.wi-moments-page__empty[data-astro-cid-ovd5htye]{text-align:center;padding:var(--space-4xl) var(--space-xl);color:var(--ink-3);font-size:var(--text-md)}.wi-moments-page__empty[data-astro-cid-ovd5htye] a[data-astro-cid-ovd5htye]{color:var(--accent)}.wi-moments-page__content[data-astro-cid-ovd5htye]{content-visibility:auto;contain-intrinsic-size:auto 800px}.wi-moments-page__actions[data-astro-cid-ovd5htye]{display:flex;align-items:center;gap:var(--space-sm)}.wi-moments-page__like-btn[data-astro-cid-ovd5htye],.wi-moments-page__comment-btn[data-astro-cid-ovd5htye]{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border:1px solid var(--rule);border-radius:9999px;background:transparent;color:var(--ink-3);font-size:var(--text-xs);font-family:var(--font-body);cursor:pointer;transition:color .2s ease,border-color .2s ease,background .2s ease}.wi-moments-page__like-btn[data-astro-cid-ovd5htye]:hover,.wi-moments-page__comment-btn[data-astro-cid-ovd5htye]:hover{color:var(--accent);border-color:var(--accent)}.wi-moments-page__like-btn--liked[data-astro-cid-ovd5htye]{color:var(--accent);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--bg));cursor:default}.wi-moments-page__like-btn--liked[data-astro-cid-ovd5htye] .wi-moments-page__like-icon[data-astro-cid-ovd5htye]{fill:var(--accent)}.wi-moments-page__comment-btn--active[data-astro-cid-ovd5htye]{color:var(--accent);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--bg))}.wi-moments-page__like-icon[data-astro-cid-ovd5htye],.wi-moments-page__comment-icon[data-astro-cid-ovd5htye]{flex-shrink:0}.wi-moments-page__like-count[data-astro-cid-ovd5htye],.wi-moments-page__comment-count[data-astro-cid-ovd5htye]{line-height:1}.wi-moments-page__comment-area[data-astro-cid-ovd5htye]{margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--rule)}.wi-moments-page__comment-area[data-astro-cid-ovd5htye] halo\:comment[data-astro-cid-ovd5htye]{display:block;width:100%}.wi-moments-page__cards[data-astro-cid-ovd5htye]{display:flex;flex-direction:column;gap:var(--space-lg);max-width:720px;margin:0 auto}.wi-moments-page__card-item[data-astro-cid-ovd5htye]{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:16px;padding:var(--space-xl);transition:box-shadow var(--duration-normal) var(--ease-out-expo),transform var(--duration-normal) var(--ease-out-expo),border-color var(--duration-normal) var(--ease-out-expo)}.wi-moments-page__card-item[data-astro-cid-ovd5htye]:hover{box-shadow:var(--shadow-md);transform:translateY(-3px);border-color:var(--accent)}.wi-moments-page__card-layout[data-astro-cid-ovd5htye]{display:flex;gap:var(--space-md);align-items:flex-start}.wi-moments-page__avatar[data-astro-cid-ovd5htye]{flex-shrink:0;width:44px;height:44px;border-radius:10px;object-fit:cover}.wi-moments-page__avatar--fallback[data-astro-cid-ovd5htye]{display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent);font-weight:700;font-size:var(--text-lg)}.wi-moments-page__main[data-astro-cid-ovd5htye]{flex:1;min-width:0}.wi-moments-page__name[data-astro-cid-ovd5htye]{font-size:var(--text-base);font-weight:600;color:var(--accent);margin-bottom:var(--space-xs)}.wi-moments-page__card-text[data-astro-cid-ovd5htye]{font-size:var(--text-base);line-height:var(--leading-relaxed);color:var(--ink);margin-bottom:var(--space-md)}.wi-moments-page__card-media[data-astro-cid-ovd5htye]{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:var(--space-md)}.wi-moments-page__card-image[data-astro-cid-ovd5htye]{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;cursor:pointer;transition:transform .2s ease}.wi-moments-page__card-image[data-astro-cid-ovd5htye]:hover{transform:scale(1.03)}.wi-moments-page__card-media[data-astro-cid-ovd5htye]:has(.wi-moments-page__card-image:only-child){grid-template-columns:1fr}.wi-moments-page__card-media[data-astro-cid-ovd5htye]:has(.wi-moments-page__card-image:only-child) .wi-moments-page__card-image[data-astro-cid-ovd5htye]{aspect-ratio:auto;max-height:300px;max-width:400px}.wi-moments-page__card-media[data-astro-cid-ovd5htye]:has(.wi-moments-page__card-image:nth-child(2):last-child){grid-Line truncated
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
.wi-subs[data-astro-cid-d5lrd5xl]{padding-block:1rem}.wi-subs__header[data-astro-cid-d5lrd5xl]{text-align:center;margin-bottom:var(--space-3xl)}.wi-subs__title[data-astro-cid-d5lrd5xl]{font-size:var(--text-4xl);margin-bottom:var(--space-sm)}.wi-subs__subtitle[data-astro-cid-d5lrd5xl]{font-size:var(--text-sm);color:var(--ink-3);margin-bottom:var(--space-sm)}.wi-page-accent[data-astro-cid-d5lrd5xl]{display:block;width:48px;height:3px;margin:var(--space-sm) auto 0;border-radius:9999px;background:var(--accent)}.wi-subs__flow[data-astro-cid-d5lrd5xl]{display:flex;flex-direction:column;gap:var(--space-lg);max-width:720px;margin-inline:auto}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__flow[data-astro-cid-d5lrd5xl]{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg);max-width:1200px}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__card[data-astro-cid-d5lrd5xl]{padding:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-md)}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__author[data-astro-cid-d5lrd5xl]{flex-direction:column;align-items:center;text-align:center;gap:var(--space-xs);margin-bottom:0}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__avatar[data-astro-cid-d5lrd5xl]{width:44px;height:44px}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__author-info[data-astro-cid-d5lrd5xl]{align-items:center;gap:2px}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__author-name[data-astro-cid-d5lrd5xl]{font-size:var(--text-sm);white-space:normal;text-align:center;line-height:var(--leading-tight);-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__date[data-astro-cid-d5lrd5xl]{font-size:var(--text-xs)}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__body[data-astro-cid-d5lrd5xl]{margin-bottom:0;flex:1;display:flex;flex-direction:column;gap:var(--space-xs)}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__post-title[data-astro-cid-d5lrd5xl]{font-size:var(--text-md);line-height:var(--leading-snug);-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;margin:0}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__summary[data-astro-cid-d5lrd5xl]{font-size:var(--text-sm);-webkit-line-clamp:3;line-clamp:3}@media(max-width:768px){.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__flow[data-astro-cid-d5lrd5xl]{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__flow[data-astro-cid-d5lrd5xl]{grid-template-columns:1fr}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__card[data-astro-cid-d5lrd5xl]{padding:var(--space-md)}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__author[data-astro-cid-d5lrd5xl]{flex-direction:row;text-align:left}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__author-info[data-astro-cid-d5lrd5xl]{align-items:flex-start}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__author-name[data-astro-cid-d5lrd5xl]{text-align:left}}.wi-subs__card[data-astro-cid-d5lrd5xl]{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:16px;padding:var(--space-xl);transition:box-shadow var(--duration-normal) var(--ease-out-expo),transform var(--duration-normal) var(--ease-out-expo),border-color var(--duration-normal) var(--ease-out-expo)}.wi-subs__card[data-astro-cid-d5lrd5xl]:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--accent)}.wi-subs__author[data-astro-cid-d5lrd5xl]{display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-md)}.wi-subs__avatar[data-astro-cid-d5lrd5xl]{width:44px;height:44px;border-radius:9999px;object-fit:cover;flex-shrink:0;box-shadow:var(--shadow-sm)}.wi-subs__avatar--placeholder[data-astro-cid-d5lrd5xl]{display:flex;align-items:center;justify-content:center;background:var(--accent-bg);color:var(--accent);font-family:var(--font-sans);font-size:var(--text-md);font-weight:700;box-shadow:none}.wi-subs__author-info[data-astro-cid-d5lrd5xl]{display:flex;flex-direction:column;gap:2px;min-width:0}.wi-subs__author-name[data-astro-cid-d5lrd5xl]{font-size:var(--text-md);font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none;transition:color var(--duration-fast) var(--ease-out-quart)}a[data-astro-cid-d5lrd5xl].wi-subs__author-name:hover{color:var(--accent)}.wi-subs__date[data-astro-cid-d5lrd5xl]{font-size:var(--text-xs);color:var(--ink-3);letter-spacing:.02em}.wi-subs__body[data-astro-cid-d5lrd5xl]{margin-bottom:var(--space-sm)}.wi-subs__title-link[data-astro-cid-d5lrd5xl]{text-decoration:none;display:block}.wi-subs__post-title[data-astro-cid-d5lrd5xl]{font-size:var(--text-lg);font-weight:600;color:var(--ink);line-height:var(--leading-snug);margin:0 0 var(--space-xs);transition:color var(--duLine truncated
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
.wi-subs[data-astro-cid-d5lrd5xl]{padding-block:1rem}.wi-subs__header[data-astro-cid-d5lrd5xl]{text-align:center;margin-bottom:var(--space-3xl)}.wi-subs__title[data-astro-cid-d5lrd5xl]{font-size:var(--text-4xl);margin-bottom:var(--space-sm)}.wi-subs__subtitle[data-astro-cid-d5lrd5xl]{font-size:var(--text-sm);color:var(--ink-3);margin-bottom:var(--space-sm)}.wi-page-accent[data-astro-cid-d5lrd5xl]{display:block;width:48px;height:3px;margin:var(--space-sm) auto 0;border-radius:9999px;background:var(--accent)}.wi-subs__flow[data-astro-cid-d5lrd5xl]{display:flex;flex-direction:column;gap:var(--space-lg);max-width:720px;margin-inline:auto}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__flow[data-astro-cid-d5lrd5xl]{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg);max-width:1200px}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__card[data-astro-cid-d5lrd5xl]{padding:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-md)}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__author[data-astro-cid-d5lrd5xl]{flex-direction:column;align-items:center;text-align:center;gap:var(--space-xs);margin-bottom:0}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__avatar[data-astro-cid-d5lrd5xl]{width:44px;height:44px}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__author-info[data-astro-cid-d5lrd5xl]{align-items:center;gap:2px}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__author-name[data-astro-cid-d5lrd5xl]{font-size:var(--text-sm);white-space:normal;text-align:center;line-height:var(--leading-tight);-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__date[data-astro-cid-d5lrd5xl]{font-size:var(--text-xs)}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__body[data-astro-cid-d5lrd5xl]{margin-bottom:0;flex:1;display:flex;flex-direction:column;gap:var(--space-xs)}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__post-title[data-astro-cid-d5lrd5xl]{font-size:var(--text-md);line-height:var(--leading-snug);-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;margin:0}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__summary[data-astro-cid-d5lrd5xl]{font-size:var(--text-sm);-webkit-line-clamp:3;line-clamp:3}@media(max-width:768px){.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__flow[data-astro-cid-d5lrd5xl]{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__flow[data-astro-cid-d5lrd5xl]{grid-template-columns:1fr}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__card[data-astro-cid-d5lrd5xl]{padding:var(--space-md)}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__author[data-astro-cid-d5lrd5xl]{flex-direction:row;text-align:left}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__author-info[data-astro-cid-d5lrd5xl]{align-items:flex-start}.wi-subs[data-astro-cid-d5lrd5xl][data-layout=grid] .wi-subs__author-name[data-astro-cid-d5lrd5xl]{text-align:left}}.wi-subs__card[data-astro-cid-d5lrd5xl]{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:16px;padding:var(--space-xl);transition:box-shadow var(--duration-normal) var(--ease-out-expo),transform var(--duration-normal) var(--ease-out-expo),border-color var(--duration-normal) var(--ease-out-expo)}.wi-subs__card[data-astro-cid-d5lrd5xl]:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--accent)}.wi-subs__author[data-astro-cid-d5lrd5xl]{display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-md)}.wi-subs__avatar[data-astro-cid-d5lrd5xl]{width:44px;height:44px;border-radius:9999px;object-fit:cover;flex-shrink:0;box-shadow:var(--shadow-sm)}.wi-subs__avatar--placeholder[data-astro-cid-d5lrd5xl]{display:flex;align-items:center;justify-content:center;background:var(--accent-bg);color:var(--accent);font-family:var(--font-sans);font-size:var(--text-md);font-weight:700;box-shadow:none}.wi-subs__author-info[data-astro-cid-d5lrd5xl]{display:flex;flex-direction:column;gap:2px;min-width:0}.wi-subs__author-name[data-astro-cid-d5lrd5xl]{font-size:var(--text-md);font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none;transition:color var(--duration-fast) var(--ease-out-quart)}a[data-astro-cid-d5lrd5xl].wi-subs__author-name:hover{color:var(--accent)}.wi-subs__date[data-astro-cid-d5lrd5xl]{font-size:var(--text-xs);color:var(--ink-3);letter-spacing:.02em}.wi-subs__body[data-astro-cid-d5lrd5xl]{margin-bottom:var(--space-sm)}.wi-subs__title-link[data-astro-cid-d5lrd5xl]{text-decoration:none;display:block}.wi-subs__post-title[data-astro-cid-d5lrd5xl]{font-size:var(--text-lg);font-weight:600;color:var(--ink);line-height:var(--leading-snug);margin:0 0 var(--space-xs);transition:color var(--duLine truncated
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
.wi-steam[data-astro-cid-2qupxtzr]{padding-block:1rem}.wi-steam__header[data-astro-cid-2qupxtzr]{text-align:center;margin-bottom:var(--space-3xl)}.wi-steam__title[data-astro-cid-2qupxtzr]{font-size:var(--text-4xl);margin-bottom:var(--space-sm)}.wi-page-accent[data-astro-cid-2qupxtzr]{display:block;width:48px;height:3px;margin:var(--space-sm) auto 0;border-radius:9999px;background:var(--accent)}.wi-steam__profile[data-astro-cid-2qupxtzr]{display:flex;align-items:center;gap:var(--space-lg);padding:var(--space-xl);background:var(--bg-raised);border:1px solid var(--rule);border-radius:16px;margin-bottom:var(--space-2xl)}.wi-steam__avatar[data-astro-cid-2qupxtzr]{position:relative;flex-shrink:0}.wi-steam__avatar-img[data-astro-cid-2qupxtzr]{width:80px;height:80px;border-radius:50%;object-fit:cover;border:3px solid var(--rule);display:block}.wi-steam__avatar-placeholder[data-astro-cid-2qupxtzr]{display:flex;align-items:center;justify-content:center;width:80px;height:80px;border-radius:50%;background:var(--accent-bg);border:3px solid var(--rule);color:var(--ink-3)}.wi-steam__status-dot[data-astro-cid-2qupxtzr]{position:absolute;bottom:4px;right:4px;width:14px;height:14px;border-radius:50%;border:2px solid var(--bg-raised)}.wi-steam__status-dot--online[data-astro-cid-2qupxtzr]{background:#22c55e}.wi-steam__status-dot--playing[data-astro-cid-2qupxtzr]{background:#3b82f6}.wi-steam__status-dot--offline[data-astro-cid-2qupxtzr]{background:#6b7280}.wi-steam__info[data-astro-cid-2qupxtzr]{flex:1;min-width:0}.wi-steam__name[data-astro-cid-2qupxtzr]{font-size:var(--text-xl);font-weight:700;color:var(--ink)}.wi-steam__status-text[data-astro-cid-2qupxtzr]{font-size:var(--text-sm);color:var(--ink-3);display:block;margin-top:2px}.wi-steam__profile-link[data-astro-cid-2qupxtzr]{font-size:var(--text-xs);color:var(--accent);text-decoration:none;display:inline-block;margin-top:4px}.wi-steam__profile-link[data-astro-cid-2qupxtzr]:hover{text-decoration:underline}.wi-steam__level[data-astro-cid-2qupxtzr]{display:flex;flex-direction:column;align-items:center;padding:var(--space-sm) var(--space-md);background:var(--accent-bg);border-radius:12px;flex-shrink:0}.wi-steam__level-num[data-astro-cid-2qupxtzr]{font-size:var(--text-2xl);font-weight:800;color:var(--accent);line-height:1}.wi-steam__level-label[data-astro-cid-2qupxtzr]{font-size:11px;color:var(--ink-3);margin-top:2px}.wi-steam__stats[data-astro-cid-2qupxtzr]{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md);margin-bottom:var(--space-2xl)}.wi-steam__stat-card[data-astro-cid-2qupxtzr]{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-lg);background:var(--bg-raised);border:1px solid var(--rule);border-radius:12px;min-height:80px}.wi-steam__stat-value[data-astro-cid-2qupxtzr]{font-size:var(--text-2xl);font-weight:800;color:var(--accent);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;container-type:inline-size}@container (max-width: 120px){.wi-steam__stat-value[data-astro-cid-2qupxtzr]{font-size:var(--text-lg)}}@container (max-width: 80px){.wi-steam__stat-value[data-astro-cid-2qupxtzr]{font-size:var(--text-md)}}.wi-steam__stat-label[data-astro-cid-2qupxtzr]{font-size:var(--text-xs);color:var(--ink-3);margin-top:4px;white-space:nowrap}.wi-steam__section[data-astro-cid-2qupxtzr]{margin-bottom:var(--space-2xl)}.wi-steam__section-title[data-astro-cid-2qupxtzr]{font-size:var(--text-xl);font-weight:700;color:var(--ink);margin-bottom:var(--space-lg);padding-bottom:var(--space-sm);border-bottom:2px solid var(--accent);display:inline-block}.wi-steam__recent-scroll[data-astro-cid-2qupxtzr]{display:flex;gap:var(--space-md);overflow-x:auto;padding-bottom:var(--space-sm);scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.wi-steam__recent-scroll[data-astro-cid-2qupxtzr]::-webkit-scrollbar{height:6px}.wi-steam__recent-scroll[data-astro-cid-2qupxtzr]::-webkit-scrollbar-track{background:var(--bg);border-radius:3px}.wi-steam__recent-scroll[data-astro-cid-2qupxtzr]::-webkit-scrollbar-thumb{background:var(--rule);border-radius:3px}.wi-steam__recent-card[data-astro-cid-2qupxtzr]{position:relative;display:flex;flex-direction:column;min-width:220px;max-width:260px;background:var(--bg-raised);border:1px solid var(--rule);border-radius:12px;overflow:hidden;scroll-snap-align:start;flex-shrink:0;transition:transform var(--duration-normal) var(--ease-out-expo),box-shadow var(--duration-normal) var(--ease-out-expo),border-color var(--duration-normal) var(--ease-out-expo)}.wi-steam__recent-card[data-astro-cid-2qupxtzr]:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--accent)}.wi-steam__recent-cover[data-astro-cid-2qupxtzr]{width:100%;overflow:hidden}.wi-steam__recent-img[data-astro-cid-2qupxtzr]{width:100%;aspect-ratio:460 / 215;object-fit:cover}.wi-steam__recent-body[data-astro-cid-2qupxtzr]{display:flex;flex-direction:column;gap:4px;padding:vLine truncated
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
.wi-steam[data-astro-cid-2qupxtzr]{padding-block:1rem}.wi-steam__header[data-astro-cid-2qupxtzr]{text-align:center;margin-bottom:var(--space-3xl)}.wi-steam__title[data-astro-cid-2qupxtzr]{font-size:var(--text-4xl);margin-bottom:var(--space-sm)}.wi-page-accent[data-astro-cid-2qupxtzr]{display:block;width:48px;height:3px;margin:var(--space-sm) auto 0;border-radius:9999px;background:var(--accent)}.wi-steam__profile[data-astro-cid-2qupxtzr]{display:flex;align-items:center;gap:var(--space-lg);padding:var(--space-xl);background:var(--bg-raised);border:1px solid var(--rule);border-radius:16px;margin-bottom:var(--space-2xl)}.wi-steam__avatar[data-astro-cid-2qupxtzr]{position:relative;flex-shrink:0}.wi-steam__avatar-img[data-astro-cid-2qupxtzr]{width:80px;height:80px;border-radius:50%;object-fit:cover;border:3px solid var(--rule);display:block}.wi-steam__avatar-placeholder[data-astro-cid-2qupxtzr]{display:flex;align-items:center;justify-content:center;width:80px;height:80px;border-radius:50%;background:var(--accent-bg);border:3px solid var(--rule);color:var(--ink-3)}.wi-steam__status-dot[data-astro-cid-2qupxtzr]{position:absolute;bottom:4px;right:4px;width:14px;height:14px;border-radius:50%;border:2px solid var(--bg-raised)}.wi-steam__status-dot--online[data-astro-cid-2qupxtzr]{background:#22c55e}.wi-steam__status-dot--playing[data-astro-cid-2qupxtzr]{background:#3b82f6}.wi-steam__status-dot--offline[data-astro-cid-2qupxtzr]{background:#6b7280}.wi-steam__info[data-astro-cid-2qupxtzr]{flex:1;min-width:0}.wi-steam__name[data-astro-cid-2qupxtzr]{font-size:var(--text-xl);font-weight:700;color:var(--ink)}.wi-steam__status-text[data-astro-cid-2qupxtzr]{font-size:var(--text-sm);color:var(--ink-3);display:block;margin-top:2px}.wi-steam__profile-link[data-astro-cid-2qupxtzr]{font-size:var(--text-xs);color:var(--accent);text-decoration:none;display:inline-block;margin-top:4px}.wi-steam__profile-link[data-astro-cid-2qupxtzr]:hover{text-decoration:underline}.wi-steam__level[data-astro-cid-2qupxtzr]{display:flex;flex-direction:column;align-items:center;padding:var(--space-sm) var(--space-md);background:var(--accent-bg);border-radius:12px;flex-shrink:0}.wi-steam__level-num[data-astro-cid-2qupxtzr]{font-size:var(--text-2xl);font-weight:800;color:var(--accent);line-height:1}.wi-steam__level-label[data-astro-cid-2qupxtzr]{font-size:11px;color:var(--ink-3);margin-top:2px}.wi-steam__stats[data-astro-cid-2qupxtzr]{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md);margin-bottom:var(--space-2xl)}.wi-steam__stat-card[data-astro-cid-2qupxtzr]{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-lg);background:var(--bg-raised);border:1px solid var(--rule);border-radius:12px;min-height:80px;container-type:inline-size}.wi-steam__stat-value[data-astro-cid-2qupxtzr]{font-size:var(--text-2xl);font-weight:800;color:var(--accent);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}@container (max-width: 120px){.wi-steam__stat-value[data-astro-cid-2qupxtzr]{font-size:var(--text-lg)}}@container (max-width: 80px){.wi-steam__stat-value[data-astro-cid-2qupxtzr]{font-size:var(--text-md)}}.wi-steam__stat-label[data-astro-cid-2qupxtzr]{font-size:var(--text-xs);color:var(--ink-3);margin-top:4px;white-space:nowrap}.wi-steam__section[data-astro-cid-2qupxtzr]{margin-bottom:var(--space-2xl)}.wi-steam__section-title[data-astro-cid-2qupxtzr]{font-size:var(--text-xl);font-weight:700;color:var(--ink);margin-bottom:var(--space-lg);padding-bottom:var(--space-sm);border-bottom:2px solid var(--accent);display:inline-block}.wi-steam__recent-scroll[data-astro-cid-2qupxtzr]{display:flex;gap:var(--space-md);overflow-x:auto;padding-bottom:var(--space-sm);scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.wi-steam__recent-scroll[data-astro-cid-2qupxtzr]::-webkit-scrollbar{height:6px}.wi-steam__recent-scroll[data-astro-cid-2qupxtzr]::-webkit-scrollbar-track{background:var(--bg);border-radius:3px}.wi-steam__recent-scroll[data-astro-cid-2qupxtzr]::-webkit-scrollbar-thumb{background:var(--rule);border-radius:3px}.wi-steam__recent-card[data-astro-cid-2qupxtzr]{position:relative;display:flex;flex-direction:column;min-width:220px;max-width:260px;background:var(--bg-raised);border:1px solid var(--rule);border-radius:12px;overflow:hidden;scroll-snap-align:start;flex-shrink:0;transition:transform var(--duration-normal) var(--ease-out-expo),box-shadow var(--duration-normal) var(--ease-out-expo),border-color var(--duration-normal) var(--ease-out-expo)}.wi-steam__recent-card[data-astro-cid-2qupxtzr]:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--accent)}.wi-steam__recent-cover[data-astro-cid-2qupxtzr]{width:100%;overflow:hidden}.wi-steam__recent-img[data-astro-cid-2qupxtzr]{width:100%;aspect-ratio:460 / 215;object-fit:cover}.wi-steam__recent-body[data-astro-cid-2qupxtzr]{display:flex;flex-direction:column;gap:4px;padding:vLine truncated
|
||||||
@@ -1,5 +1,31 @@
|
|||||||
# 更新日志
|
# 更新日志
|
||||||
|
|
||||||
|
## v1.2.2
|
||||||
|
|
||||||
|
### 问题修复
|
||||||
|
|
||||||
|
- 🐛 **修复移动端抽屉菜单不显示二级菜单**:子菜单的 `th:block` 写在了 `th:each` 循环外,
|
||||||
|
循环变量出了循环即失效,二级菜单从未渲染过;现在子菜单与父项一起循环输出
|
||||||
|
- 🐛 **修复页脚遮挡内容弹层**:页脚的 `z-index: 1` 与内容区同级且靠后,
|
||||||
|
会盖住评论区翻页下拉等浮层;同时把 `.wi-main` / `.wi-content-wrap` 的
|
||||||
|
`overflow-x: hidden` 改为 `clip`,不再产生会纵向裁掉弹层的滚动容器
|
||||||
|
- 🐛 **修复深浅色切换不同步**:页脚背景是渐变(`background-image`),
|
||||||
|
无法参与过渡动画,切换时页脚瞬变而内容区还在 300ms 渐变;
|
||||||
|
改为可过渡的 `background-color` + 遮罩渐隐色层,全站同步过渡
|
||||||
|
- 🐛 **修复玻璃卡片悬浮时顶部边框消失**:Chromium 下带 `backdrop-filter` 的元素
|
||||||
|
一旦发生位移(悬浮上移),合成层会吃掉顶部 1px 边框。已移除瞬间、友链页、
|
||||||
|
友链圈、订阅页卡片的 `backdrop-filter`(卡片背后是纯页面背景,模糊无可见效果),
|
||||||
|
并给瞬间卡片悬浮时加描边高亮
|
||||||
|
|
||||||
|
### 功能与优化
|
||||||
|
|
||||||
|
- 🎨 **新增瞬间详情页主题化模板**(`moment.html`):覆盖插件默认模板,
|
||||||
|
复用瞬间列表页的卡片视觉(头像 + 昵称 + 时间 + 正文 + 九宫格 + 点赞),
|
||||||
|
评论区默认展开,附返回列表入口与空态兜底;支持灯箱看图
|
||||||
|
- 🎨 **Steam 游戏库页**:统计数据加载失败时不再整块隐藏,改为显示 `-` 并给出
|
||||||
|
原因提示(Steam 接口超时 / 游戏库隐私 / 插件配置);「最近游玩」卡片成就进度
|
||||||
|
移到右侧并增加奖杯标识
|
||||||
|
|
||||||
## v1.2.1
|
## v1.2.1
|
||||||
|
|
||||||
### 问题修复
|
### 问题修复
|
||||||
|
|||||||
+1
-1
@@ -1,5 +1,5 @@
|
|||||||
{
|
{
|
||||||
"version": "1.2.1",
|
"version": "1.2.2",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=22.12.0"
|
"node": ">=22.12.0"
|
||||||
|
|||||||
@@ -98,18 +98,31 @@ const THEME_VERSION = readThemeVersion();
|
|||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
/*
|
||||||
|
* 页脚不要创建高于内容的绘制层级:
|
||||||
|
* - 之前 z-index:1 与 .wi-main 同级且靠后,会盖住内容区的弹层(如评论区翻页下拉)
|
||||||
|
* - 渐变背景(background-image)无法参与过渡,导致深浅色切换时页脚瞬变、
|
||||||
|
* 内容区还在渐变,看起来"不同步";改为 background-color + 遮罩渐隐的
|
||||||
|
* 伪色层,两者都能随 .wi-theme-transition 平滑过渡
|
||||||
|
*/
|
||||||
footer {
|
footer {
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 1;
|
|
||||||
border-top: 1px solid var(--rule);
|
border-top: 1px solid var(--rule);
|
||||||
background: linear-gradient(
|
background-color: var(--bg);
|
||||||
to bottom,
|
}
|
||||||
var(--bg),
|
|
||||||
color-mix(in srgb, var(--bg) 97%, var(--accent) 3%)
|
footer::before {
|
||||||
);
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
inset: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
background-color: color-mix(in srgb, var(--bg) 97%, var(--accent) 3%);
|
||||||
|
-webkit-mask-image: linear-gradient(to bottom, transparent, #000);
|
||||||
|
mask-image: linear-gradient(to bottom, transparent, #000);
|
||||||
}
|
}
|
||||||
|
|
||||||
.footer-inner {
|
.footer-inner {
|
||||||
|
position: relative;
|
||||||
max-width: 1200px;
|
max-width: 1200px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
|||||||
@@ -57,8 +57,6 @@
|
|||||||
gap: var(--space-md);
|
gap: var(--space-md);
|
||||||
padding: var(--space-lg);
|
padding: var(--space-lg);
|
||||||
background: var(--glass-bg);
|
background: var(--glass-bg);
|
||||||
backdrop-filter: blur(16px);
|
|
||||||
-webkit-backdrop-filter: blur(16px);
|
|
||||||
border: 1px solid var(--glass-border);
|
border: 1px solid var(--glass-border);
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|||||||
@@ -13,8 +13,8 @@
|
|||||||
<th:block th:if="${menuFinder != null}">
|
<th:block th:if="${menuFinder != null}">
|
||||||
<th:block th:with="menu = ${menuFinder.getPrimary()}">
|
<th:block th:with="menu = ${menuFinder.getPrimary()}">
|
||||||
<th:block th:if="${menu != null and menu.menuItems != null and not #lists.isEmpty(menu.menuItems)}">
|
<th:block th:if="${menu != null and menu.menuItems != null and not #lists.isEmpty(menu.menuItems)}">
|
||||||
|
<th:block th:each="menuItem : ${menu.menuItems}">
|
||||||
<a
|
<a
|
||||||
th:each="menuItem : ${menu.menuItems}"
|
|
||||||
th:href="@{${menuItem.status.href}}"
|
th:href="@{${menuItem.status.href}}"
|
||||||
th:target="${menuItem.spec?.target?.value == '_blank'} ? '_blank' : '_self'"
|
th:target="${menuItem.spec?.target?.value == '_blank'} ? '_blank' : '_self'"
|
||||||
th:text="${menuItem.status.displayName}"
|
th:text="${menuItem.status.displayName}"
|
||||||
@@ -26,7 +26,7 @@
|
|||||||
th:each="child : ${menuItem.children}"
|
th:each="child : ${menuItem.children}"
|
||||||
th:href="@{${child.status.href}}"
|
th:href="@{${child.status.href}}"
|
||||||
th:target="${child.spec?.target?.value == '_blank'} ? '_blank' : '_self'"
|
th:target="${child.spec?.target?.value == '_blank'} ? '_blank' : '_self'"
|
||||||
th:text="${'| ' + child.status.displayName}"
|
th:text="${child.status.displayName}"
|
||||||
class="wi-mobile-menu__link wi-mobile-menu__link--sub"
|
class="wi-mobile-menu__link wi-mobile-menu__link--sub"
|
||||||
th:data-href="${child.status.href}"
|
th:data-href="${child.status.href}"
|
||||||
></a>
|
></a>
|
||||||
@@ -34,6 +34,7 @@
|
|||||||
</th:block>
|
</th:block>
|
||||||
</th:block>
|
</th:block>
|
||||||
</th:block>
|
</th:block>
|
||||||
|
</th:block>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<div class="wi-mobile-menu__footer">
|
<div class="wi-mobile-menu__footer">
|
||||||
|
|||||||
@@ -168,8 +168,6 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
|
|
||||||
.wi-friends-page__card {
|
.wi-friends-page__card {
|
||||||
background: var(--glass-bg);
|
background: var(--glass-bg);
|
||||||
backdrop-filter: blur(16px);
|
|
||||||
-webkit-backdrop-filter: blur(16px);
|
|
||||||
border: 1px solid var(--glass-border);
|
border: 1px solid var(--glass-border);
|
||||||
border-radius: 16px;
|
border-radius: 16px;
|
||||||
padding: var(--space-xl);
|
padding: var(--space-xl);
|
||||||
|
|||||||
@@ -551,8 +551,6 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
gap: var(--space-md);
|
gap: var(--space-md);
|
||||||
padding: var(--space-lg);
|
padding: var(--space-lg);
|
||||||
background: var(--glass-bg);
|
background: var(--glass-bg);
|
||||||
backdrop-filter: blur(16px);
|
|
||||||
-webkit-backdrop-filter: blur(16px);
|
|
||||||
border: 1px solid var(--glass-border);
|
border: 1px solid var(--glass-border);
|
||||||
border-radius: 16px;
|
border-radius: 16px;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
|||||||
@@ -0,0 +1,407 @@
|
|||||||
|
---
|
||||||
|
/**
|
||||||
|
* 瞬间详情页(templates/moment.html,覆盖 plugin-moments 默认模板)
|
||||||
|
* ---------------------------------------------------------------
|
||||||
|
* 插件默认模板没有套主题样式,排版松散。这里复用瞬间列表页的
|
||||||
|
* 「朋友圈式卡片」视觉:头像 + 昵称 + 时间 + 正文 + 九宫格媒体 + 点赞,
|
||||||
|
* 评论区默认展开,底部保留返回列表入口。
|
||||||
|
*
|
||||||
|
* 插件路由传入的模型变量:moment(MomentVo)、title、haloCommentEnabled。
|
||||||
|
* moment 取不到(已删除/链接错误)时显示空态,避免 SpEL 取 null 属性 500。
|
||||||
|
*/
|
||||||
|
import Layout from "../layouts/Layout.astro";
|
||||||
|
import LightGallery from "../components/LightGallery.astro";
|
||||||
|
---
|
||||||
|
|
||||||
|
<Layout>
|
||||||
|
<Fragment slot="head">
|
||||||
|
<title th:text="|${title} - ${site.title}|">瞬间</title>
|
||||||
|
</Fragment>
|
||||||
|
|
||||||
|
<section class="wi-moment-detail">
|
||||||
|
<h1 class="wi-moment-detail__sr-only" th:text="'瞬间详情'">瞬间详情</h1>
|
||||||
|
<div class="wi-moment-detail__topbar">
|
||||||
|
<a class="wi-moment-detail__back" href="/moments" th:href="@{/moments}">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m12 19-7-7 7-7"/><path d="M19 12H5"/></svg>
|
||||||
|
<span th:text="'返回瞬间列表'">返回瞬间列表</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<th:block th:if="${moment != null}">
|
||||||
|
<article class="wi-moment-detail__card" th:with="detailContent=${moment.spec?.content}">
|
||||||
|
<div class="wi-moment-detail__layout">
|
||||||
|
<img
|
||||||
|
th:if="${moment.owner != null and !#strings.isEmpty(moment.owner.avatar)}"
|
||||||
|
class="wi-moment-detail__avatar"
|
||||||
|
th:src="${moment.owner.avatar}"
|
||||||
|
th:alt="''"
|
||||||
|
loading="eager"
|
||||||
|
decoding="async"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
th:unless="${moment.owner != null and !#strings.isEmpty(moment.owner.avatar)}"
|
||||||
|
class="wi-moment-detail__avatar wi-moment-detail__avatar--fallback"
|
||||||
|
aria-hidden="true"
|
||||||
|
>
|
||||||
|
<span th:text="${#strings.substring(site.title, 0, 1)}"></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="wi-moment-detail__main">
|
||||||
|
<div class="wi-moment-detail__head">
|
||||||
|
<span
|
||||||
|
class="wi-moment-detail__name"
|
||||||
|
th:text="${moment.owner != null and !#strings.isEmpty(moment.owner.displayName) ? moment.owner.displayName : site.title}"
|
||||||
|
></span>
|
||||||
|
<time
|
||||||
|
class="wi-moment-detail__date"
|
||||||
|
th:datetime="${moment.spec?.releaseTime ?: moment.metadata?.creationTimestamp}"
|
||||||
|
th:text="${#dates.format(moment.spec?.releaseTime ?: moment.metadata?.creationTimestamp, 'yyyy-MM-dd HH:mm')}"
|
||||||
|
></time>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="wi-moment-detail__text" th:utext="${detailContent?.html ?: detailContent?.raw ?: ''}"></div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="wi-moment-detail__media wi-moments-page__card-media"
|
||||||
|
th:if="${detailContent != null and detailContent.medium != null and !#lists.isEmpty(detailContent.medium)}"
|
||||||
|
>
|
||||||
|
<th:block th:each="medium : ${detailContent.medium}">
|
||||||
|
<img
|
||||||
|
th:if="${medium.type.name == 'PHOTO'}"
|
||||||
|
class="wi-moment-detail__image"
|
||||||
|
th:src="${medium.url}"
|
||||||
|
th:alt="''"
|
||||||
|
loading="lazy"
|
||||||
|
decoding="async"
|
||||||
|
/>
|
||||||
|
<video
|
||||||
|
th:if="${medium.type.name == 'VIDEO'}"
|
||||||
|
class="wi-moment-detail__video"
|
||||||
|
th:src="${medium.url}"
|
||||||
|
controls
|
||||||
|
preload="metadata"
|
||||||
|
></video>
|
||||||
|
<audio
|
||||||
|
th:if="${medium.type.name == 'AUDIO'}"
|
||||||
|
class="wi-moment-detail__audio"
|
||||||
|
th:src="${medium.url}"
|
||||||
|
controls
|
||||||
|
preload="metadata"
|
||||||
|
></audio>
|
||||||
|
</th:block>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="wi-moment-detail__actions">
|
||||||
|
<button
|
||||||
|
class="wi-moment-detail__like-btn"
|
||||||
|
type="button"
|
||||||
|
aria-label="点赞"
|
||||||
|
th:attr="data-moment-name=${moment.metadata.name}"
|
||||||
|
>
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"/></svg>
|
||||||
|
<span class="wi-moment-detail__like-count" th:text="${moment.stats?.upvote ?: 0}">0</span>
|
||||||
|
</button>
|
||||||
|
<span class="wi-moment-detail__comment-hint">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>
|
||||||
|
<span th:text="${moment.stats?.approvedComment ?: 0}">0</span>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<section class="wi-moment-detail__comments" th:if="${haloCommentEnabled}">
|
||||||
|
<halo:comment
|
||||||
|
group="moment.halo.run"
|
||||||
|
kind="Moment"
|
||||||
|
th:attr="name=${moment.metadata.name}"
|
||||||
|
/>
|
||||||
|
</section>
|
||||||
|
</th:block>
|
||||||
|
|
||||||
|
<th:block th:if="${moment == null}">
|
||||||
|
<div class="wi-moment-detail__empty">
|
||||||
|
<p th:text="'这条瞬间不存在,或已经被删除了 🌙'">这条瞬间不存在,或已经被删除了 🌙</p>
|
||||||
|
</div>
|
||||||
|
</th:block>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<LightGallery />
|
||||||
|
</Layout>
|
||||||
|
|
||||||
|
<script is:inline th:inline="none">
|
||||||
|
(function () {
|
||||||
|
/* 页面加载时恢复已点赞状态(与 moments.astro 列表页一致) */
|
||||||
|
document.querySelectorAll(".wi-moment-detail__like-btn").forEach(function (btn) {
|
||||||
|
var name = btn.getAttribute("data-moment-name");
|
||||||
|
if (name && localStorage.getItem("wi-moment-liked-" + name)) {
|
||||||
|
btn.classList.add("wi-moment-detail__like-btn--liked");
|
||||||
|
btn.setAttribute("aria-pressed", "true");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
document.addEventListener("click", function (e) {
|
||||||
|
var likeBtn = e.target.closest(".wi-moment-detail__like-btn");
|
||||||
|
if (!likeBtn) return;
|
||||||
|
var momentName = likeBtn.getAttribute("data-moment-name");
|
||||||
|
if (!momentName) return;
|
||||||
|
var likedKey = "wi-moment-liked-" + momentName;
|
||||||
|
var countEl = likeBtn.querySelector(".wi-moment-detail__like-count");
|
||||||
|
if (localStorage.getItem(likedKey)) return;
|
||||||
|
if (likeBtn.classList.contains("wi-moment-detail__like-btn--liked")) return;
|
||||||
|
fetch("/apis/api.halo.run/v1alpha1/trackers/upvote", {
|
||||||
|
method: "POST",
|
||||||
|
headers: { "Content-Type": "application/json;charset=UTF-8" },
|
||||||
|
body: JSON.stringify({
|
||||||
|
group: "moment.halo.run",
|
||||||
|
plural: "moments",
|
||||||
|
name: momentName,
|
||||||
|
}),
|
||||||
|
})
|
||||||
|
.then(function (res) {
|
||||||
|
if (!res.ok) throw new Error("Like failed");
|
||||||
|
likeBtn.classList.add("wi-moment-detail__like-btn--liked");
|
||||||
|
likeBtn.setAttribute("aria-pressed", "true");
|
||||||
|
if (countEl) {
|
||||||
|
countEl.textContent = parseInt(countEl.textContent || "0", 10) + 1;
|
||||||
|
}
|
||||||
|
localStorage.setItem(likedKey, "1");
|
||||||
|
})
|
||||||
|
.catch(function (err) {
|
||||||
|
console.error("Like error:", err);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
})();
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.wi-moment-detail {
|
||||||
|
padding-block: 1rem;
|
||||||
|
max-width: 720px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 仅供屏幕阅读器的页面级标题 */
|
||||||
|
.wi-moment-detail__sr-only {
|
||||||
|
position: absolute;
|
||||||
|
width: 1px;
|
||||||
|
height: 1px;
|
||||||
|
padding: 0;
|
||||||
|
margin: -1px;
|
||||||
|
overflow: hidden;
|
||||||
|
clip: rect(0 0 0 0);
|
||||||
|
white-space: nowrap;
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__topbar {
|
||||||
|
margin-bottom: var(--space-lg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__back {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.375rem;
|
||||||
|
padding: 0.375rem 0.875rem;
|
||||||
|
border-radius: 9999px;
|
||||||
|
font-size: var(--text-sm);
|
||||||
|
color: var(--ink-2);
|
||||||
|
text-decoration: none;
|
||||||
|
background: var(--bg-raised);
|
||||||
|
transition:
|
||||||
|
color var(--duration-fast) var(--ease-out-quart),
|
||||||
|
background var(--duration-fast) var(--ease-out-quart);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__back:hover {
|
||||||
|
color: var(--accent);
|
||||||
|
background: var(--accent-bg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__card {
|
||||||
|
background: var(--glass-bg);
|
||||||
|
border: 1px solid var(--glass-border);
|
||||||
|
border-radius: 16px;
|
||||||
|
padding: var(--space-xl);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__layout {
|
||||||
|
display: flex;
|
||||||
|
gap: var(--space-md);
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__avatar {
|
||||||
|
width: 44px;
|
||||||
|
height: 44px;
|
||||||
|
border-radius: 10px;
|
||||||
|
object-fit: cover;
|
||||||
|
flex-shrink: 0;
|
||||||
|
box-shadow: var(--shadow-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__avatar--fallback {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background: var(--accent-bg);
|
||||||
|
color: var(--accent);
|
||||||
|
font-family: var(--font-sans);
|
||||||
|
font-size: var(--text-md);
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__main {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__head {
|
||||||
|
display: flex;
|
||||||
|
align-items: baseline;
|
||||||
|
gap: var(--space-sm);
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__name {
|
||||||
|
font-size: var(--text-md);
|
||||||
|
font-weight: 600;
|
||||||
|
color: var(--ink);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__date {
|
||||||
|
font-size: var(--text-xs);
|
||||||
|
color: var(--ink-3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__text {
|
||||||
|
margin-top: var(--space-sm);
|
||||||
|
font-size: var(--text-base);
|
||||||
|
line-height: var(--leading-relaxed);
|
||||||
|
color: var(--ink);
|
||||||
|
word-wrap: break-word;
|
||||||
|
overflow-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__text :global(img) {
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__media {
|
||||||
|
margin-top: var(--space-md);
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
gap: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 与列表页一致的微信九宫格规则:单图自然比例,2 图两列,4 图 2x2 */
|
||||||
|
.wi-moment-detail__media:has(.wi-moment-detail__image:only-child) {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__media:has(.wi-moment-detail__image:only-child) .wi-moment-detail__image {
|
||||||
|
aspect-ratio: auto;
|
||||||
|
max-height: 300px;
|
||||||
|
max-width: 400px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__media:has(.wi-moment-detail__image:nth-child(2):last-child) {
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__media:has(.wi-moment-detail__image:nth-child(4)):not(:has(.wi-moment-detail__image:nth-child(5))) {
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
max-width: 72%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__media:has(.wi-moment-detail__image:nth-child(3)) {
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__image {
|
||||||
|
width: 100%;
|
||||||
|
aspect-ratio: 1;
|
||||||
|
object-fit: cover;
|
||||||
|
border-radius: 8px;
|
||||||
|
cursor: zoom-in;
|
||||||
|
transition: transform 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__image:hover {
|
||||||
|
transform: scale(1.02);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__video {
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 8px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__audio {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__actions {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: var(--space-sm);
|
||||||
|
margin-top: var(--space-md);
|
||||||
|
padding-top: var(--space-md);
|
||||||
|
border-top: 1px solid var(--rule);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__like-btn,
|
||||||
|
.wi-moment-detail__comment-hint {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.375rem;
|
||||||
|
padding: 0.375rem 0.875rem;
|
||||||
|
border: 1px solid var(--rule);
|
||||||
|
border-radius: 9999px;
|
||||||
|
background: transparent;
|
||||||
|
color: var(--ink-2);
|
||||||
|
font-size: var(--text-xs);
|
||||||
|
transition:
|
||||||
|
color var(--duration-fast) var(--ease-out-quart),
|
||||||
|
border-color var(--duration-fast) var(--ease-out-quart),
|
||||||
|
background var(--duration-fast) var(--ease-out-quart);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__like-btn {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__comment-hint {
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__like-btn:hover,
|
||||||
|
.wi-moment-detail__like-btn--liked {
|
||||||
|
color: var(--accent);
|
||||||
|
border-color: var(--accent);
|
||||||
|
background: var(--accent-bg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__comments {
|
||||||
|
margin-top: var(--space-xl);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__empty {
|
||||||
|
text-align: center;
|
||||||
|
padding: var(--space-4xl) var(--space-xl);
|
||||||
|
color: var(--ink-3);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 640px) {
|
||||||
|
.wi-moment-detail__card {
|
||||||
|
padding: var(--space-lg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-moment-detail__avatar {
|
||||||
|
width: 38px;
|
||||||
|
height: 38px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -538,19 +538,22 @@ import LightGallery from "../components/LightGallery.astro";
|
|||||||
|
|
||||||
.wi-moments-page__card-item {
|
.wi-moments-page__card-item {
|
||||||
background: var(--glass-bg);
|
background: var(--glass-bg);
|
||||||
backdrop-filter: blur(16px);
|
/* 不用 backdrop-filter:Chromium 下带 backdrop-filter 的元素一发生
|
||||||
-webkit-backdrop-filter: blur(16px);
|
transform(悬浮上移),合成层就会吃掉顶部 1px 边框;卡片背后是
|
||||||
|
纯页面背景,毛玻璃模糊本身没有可见效果,去掉即可修复 */
|
||||||
border: 1px solid var(--glass-border);
|
border: 1px solid var(--glass-border);
|
||||||
border-radius: 16px;
|
border-radius: 16px;
|
||||||
padding: var(--space-xl);
|
padding: var(--space-xl);
|
||||||
transition:
|
transition:
|
||||||
box-shadow var(--duration-normal) var(--ease-out-expo),
|
box-shadow var(--duration-normal) var(--ease-out-expo),
|
||||||
transform var(--duration-normal) var(--ease-out-expo);
|
transform var(--duration-normal) var(--ease-out-expo),
|
||||||
|
border-color var(--duration-normal) var(--ease-out-expo);
|
||||||
}
|
}
|
||||||
|
|
||||||
.wi-moments-page__card-item:hover {
|
.wi-moments-page__card-item:hover {
|
||||||
box-shadow: var(--shadow-md);
|
box-shadow: var(--shadow-md);
|
||||||
transform: translateY(-3px);
|
transform: translateY(-3px);
|
||||||
|
border-color: var(--accent);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 朋友圈式布局:头像在左,昵称/正文/九宫格在右 */
|
/* 朋友圈式布局:头像在左,昵称/正文/九宫格在右 */
|
||||||
|
|||||||
@@ -118,5 +118,5 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
</Layout>
|
</Layout>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.wi-subs{padding-block:1rem}.wi-subs__header{text-align:center;margin-bottom:var(--space-3xl)}.wi-subs__title{font-size:var(--text-4xl);margin-bottom:var(--space-sm)}.wi-subs__subtitle{font-size:var(--text-sm);color:var(--ink-3);margin-bottom:var(--space-sm)}.wi-page-accent{display:block;width:48px;height:3px;margin:var(--space-sm) auto 0;border-radius:9999px;background:var(--accent)}.wi-subs__flow{display:flex;flex-direction:column;gap:var(--space-lg);max-width:720px;margin-inline:auto}.wi-subs[data-layout=grid] .wi-subs__flow{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg);max-width:1200px}.wi-subs[data-layout=grid] .wi-subs__card{padding:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-md)}.wi-subs[data-layout=grid] .wi-subs__author{flex-direction:column;align-items:center;text-align:center;gap:var(--space-xs);margin-bottom:0}.wi-subs[data-layout=grid] .wi-subs__avatar{width:44px;height:44px}.wi-subs[data-layout=grid] .wi-subs__author-info{align-items:center;gap:2px}.wi-subs[data-layout=grid] .wi-subs__author-name{font-size:var(--text-sm);white-space:normal;text-align:center;line-height:var(--leading-tight);-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.wi-subs[data-layout=grid] .wi-subs__date{font-size:var(--text-xs)}.wi-subs[data-layout=grid] .wi-subs__body{margin-bottom:0;flex:1;display:flex;flex-direction:column;gap:var(--space-xs)}.wi-subs[data-layout=grid] .wi-subs__post-title{font-size:var(--text-md);line-height:var(--leading-snug);-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;margin:0}.wi-subs[data-layout=grid] .wi-subs__summary{font-size:var(--text-sm);-webkit-line-clamp:3;line-clamp:3}@media(max-width:768px){.wi-subs[data-layout=grid] .wi-subs__flow{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.wi-subs[data-layout=grid] .wi-subs__flow{grid-template-columns:1fr}.wi-subs[data-layout=grid] .wi-subs__card{padding:var(--space-md)}.wi-subs[data-layout=grid] .wi-subs__author{flex-direction:row;text-align:left}.wi-subs[data-layout=grid] .wi-subs__author-info{align-items:flex-start}.wi-subs[data-layout=grid] .wi-subs__author-name{text-align:left}}.wi-subs__card{background:var(--glass-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);border-radius:16px;padding:var(--space-xl);transition:box-shadow var(--duration-normal) var(--ease-out-expo),transform var(--duration-normal) var(--ease-out-expo),border-color var(--duration-normal) var(--ease-out-expo)}.wi-subs__card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--accent)}.wi-subs__author{display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-md)}.wi-subs__avatar{width:44px;height:44px;border-radius:9999px;object-fit:cover;flex-shrink:0;box-shadow:var(--shadow-sm)}.wi-subs__avatar--placeholder{display:flex;align-items:center;justify-content:center;background:var(--accent-bg);color:var(--accent);font-family:var(--font-sans);font-size:var(--text-md);font-weight:700;box-shadow:none}.wi-subs__author-info{display:flex;flex-direction:column;gap:2px;min-width:0}.wi-subs__author-name{font-size:var(--text-md);font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none;transition:color var(--duration-fast) var(--ease-out-quart)}a.wi-subs__author-name:hover{color:var(--accent)}.wi-subs__date{font-size:var(--text-xs);color:var(--ink-3);letter-spacing:.02em}.wi-subs__body{margin-bottom:var(--space-sm)}.wi-subs__title-link{text-decoration:none;display:block}.wi-subs__post-title{font-size:var(--text-lg);font-weight:600;color:var(--ink);line-height:var(--leading-snug);margin:0 0 var(--space-xs);transition:color var(--duration-fast) var(--ease-out-quart)}.wi-subs__title-link:hover .wi-subs__post-title{color:var(--accent)}.wi-subs__summary{font-size:var(--text-sm);color:var(--ink-2);line-height:var(--leading-relaxed);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-block-end:0}.wi-subs__pagination{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:var(--space-2xl);padding-top:var(--space-xl);border-top:1px solid var(--rule)}.wi-subs__page-link{display:inline-flex;align-items:center;padding:var(--space-sm) var(--space-md);min-height:44px;color:var(--accent);text-decoration:none;font-size:var(--text-sm);font-weight:500;border-radius:var(--radius-sm);transition:opacity var(--duration-fast) var(--ease-out-quart),background var(--duration-fast) var(--ease-out-quart)}.wi-subs__page-link:hover{opacity:.8;background:var(--bg-raised)}.wi-subs__page-link--placeholder{visibility:hidden;pointer-events:none}.wi-subs__page-info{color:var(--ink-3);font-size:var(--text-sm)}.wi-subs__empty{text-align:center;padding:var(--space-4xl) var(--space-xl);color:var(--ink-3);font-size:var(--text-md)}.wi-subs__empty a{color:var(--accent)}.wLine truncated
|
.wi-subs{padding-block:1rem}.wi-subs__header{text-align:center;margin-bottom:var(--space-3xl)}.wi-subs__title{font-size:var(--text-4xl);margin-bottom:var(--space-sm)}.wi-subs__subtitle{font-size:var(--text-sm);color:var(--ink-3);margin-bottom:var(--space-sm)}.wi-page-accent{display:block;width:48px;height:3px;margin:var(--space-sm) auto 0;border-radius:9999px;background:var(--accent)}.wi-subs__flow{display:flex;flex-direction:column;gap:var(--space-lg);max-width:720px;margin-inline:auto}.wi-subs[data-layout=grid] .wi-subs__flow{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg);max-width:1200px}.wi-subs[data-layout=grid] .wi-subs__card{padding:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-md)}.wi-subs[data-layout=grid] .wi-subs__author{flex-direction:column;align-items:center;text-align:center;gap:var(--space-xs);margin-bottom:0}.wi-subs[data-layout=grid] .wi-subs__avatar{width:44px;height:44px}.wi-subs[data-layout=grid] .wi-subs__author-info{align-items:center;gap:2px}.wi-subs[data-layout=grid] .wi-subs__author-name{font-size:var(--text-sm);white-space:normal;text-align:center;line-height:var(--leading-tight);-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.wi-subs[data-layout=grid] .wi-subs__date{font-size:var(--text-xs)}.wi-subs[data-layout=grid] .wi-subs__body{margin-bottom:0;flex:1;display:flex;flex-direction:column;gap:var(--space-xs)}.wi-subs[data-layout=grid] .wi-subs__post-title{font-size:var(--text-md);line-height:var(--leading-snug);-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;margin:0}.wi-subs[data-layout=grid] .wi-subs__summary{font-size:var(--text-sm);-webkit-line-clamp:3;line-clamp:3}@media(max-width:768px){.wi-subs[data-layout=grid] .wi-subs__flow{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.wi-subs[data-layout=grid] .wi-subs__flow{grid-template-columns:1fr}.wi-subs[data-layout=grid] .wi-subs__card{padding:var(--space-md)}.wi-subs[data-layout=grid] .wi-subs__author{flex-direction:row;text-align:left}.wi-subs[data-layout=grid] .wi-subs__author-info{align-items:flex-start}.wi-subs[data-layout=grid] .wi-subs__author-name{text-align:left}}.wi-subs__card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:16px;padding:var(--space-xl);transition:box-shadow var(--duration-normal) var(--ease-out-expo),transform var(--duration-normal) var(--ease-out-expo),border-color var(--duration-normal) var(--ease-out-expo)}.wi-subs__card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--accent)}.wi-subs__author{display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-md)}.wi-subs__avatar{width:44px;height:44px;border-radius:9999px;object-fit:cover;flex-shrink:0;box-shadow:var(--shadow-sm)}.wi-subs__avatar--placeholder{display:flex;align-items:center;justify-content:center;background:var(--accent-bg);color:var(--accent);font-family:var(--font-sans);font-size:var(--text-md);font-weight:700;box-shadow:none}.wi-subs__author-info{display:flex;flex-direction:column;gap:2px;min-width:0}.wi-subs__author-name{font-size:var(--text-md);font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none;transition:color var(--duration-fast) var(--ease-out-quart)}a.wi-subs__author-name:hover{color:var(--accent)}.wi-subs__date{font-size:var(--text-xs);color:var(--ink-3);letter-spacing:.02em}.wi-subs__body{margin-bottom:var(--space-sm)}.wi-subs__title-link{text-decoration:none;display:block}.wi-subs__post-title{font-size:var(--text-lg);font-weight:600;color:var(--ink);line-height:var(--leading-snug);margin:0 0 var(--space-xs);transition:color var(--duration-fast) var(--ease-out-quart)}.wi-subs__title-link:hover .wi-subs__post-title{color:var(--accent)}.wi-subs__summary{font-size:var(--text-sm);color:var(--ink-2);line-height:var(--leading-relaxed);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-block-end:0}.wi-subs__pagination{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:var(--space-2xl);padding-top:var(--space-xl);border-top:1px solid var(--rule)}.wi-subs__page-link{display:inline-flex;align-items:center;padding:var(--space-sm) var(--space-md);min-height:44px;color:var(--accent);text-decoration:none;font-size:var(--text-sm);font-weight:500;border-radius:var(--radius-sm, 8px);transition:opacity var(--duration-fast) var(--ease-out-quart),background var(--duration-fast) var(--ease-out-quart)}.wi-subs__page-link:hover{opacity:.8;background:var(--bg-raised)}.wi-subs__page-link--placeholder{visibility:hidden;pointer-events:none}.wi-subs__page-info{color:var(--ink-3);font-size:var(--text-sm)}.wi-subs__empty{text-align:center;padding:var(--space-4xl) var(--space-xl);color:var(--ink-3);font-size:var(--text-md)}.wi-subs__empty a{color:var(--accent)}.wi-subs__infinite-sentinel{height:1px;width:100%}.wi-subs_Line truncated
|
||||||
</style>
|
</style>
|
||||||
+36
-8
@@ -63,24 +63,29 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="wi-steam__stats" th:if="${stats != null}">
|
<div class="wi-steam__stats">
|
||||||
<div class="wi-steam__stat-card">
|
<div class="wi-steam__stat-card">
|
||||||
<span class="wi-steam__stat-value" th:text="${stats.totalGames} ?: 0">0</span>
|
<span class="wi-steam__stat-value" th:text="${stats != null and stats.totalGames != null ? stats.totalGames : '-'}">-</span>
|
||||||
<span class="wi-steam__stat-label" th:text="'拥有游戏'">拥有游戏</span>
|
<span class="wi-steam__stat-label" th:text="'拥有游戏'">拥有游戏</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="wi-steam__stat-card">
|
<div class="wi-steam__stat-card">
|
||||||
<span class="wi-steam__stat-value" th:text="${stats.totalPlaytimeFormatted} ?: '0 hours'">0 hours</span>
|
<span class="wi-steam__stat-value" th:text="${stats != null and stats.totalPlaytimeFormatted != null ? stats.totalPlaytimeFormatted : '-'}">-</span>
|
||||||
<span class="wi-steam__stat-label" th:text="'总游玩时长'">总游玩时长</span>
|
<span class="wi-steam__stat-label" th:text="'总游玩时长'">总游玩时长</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="wi-steam__stat-card">
|
<div class="wi-steam__stat-card">
|
||||||
<span class="wi-steam__stat-value" th:text="${stats.recentPlaytimeFormatted} ?: '0 hours'">0 hours</span>
|
<span class="wi-steam__stat-value" th:text="${stats != null and stats.recentPlaytimeFormatted != null ? stats.recentPlaytimeFormatted : '-'}">-</span>
|
||||||
<span class="wi-steam__stat-label" th:text="'近两周'">近两周</span>
|
<span class="wi-steam__stat-label" th:text="'近两周'">近两周</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="wi-steam__stat-card">
|
<div class="wi-steam__stat-card">
|
||||||
<span class="wi-steam__stat-value" th:text="${badges != null and badges.totalBadges != null ? badges.totalBadges : 0}">0</span>
|
<span class="wi-steam__stat-value" th:text="${badges != null and badges.totalBadges != null ? badges.totalBadges : '-'}">-</span>
|
||||||
<span class="wi-steam__stat-label" th:text="'徽章'">徽章</span>
|
<span class="wi-steam__stat-label" th:text="'徽章'">徽章</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<p
|
||||||
|
class="wi-steam__stats-hint"
|
||||||
|
th:if="${stats == null or badges == null}"
|
||||||
|
th:text="'Steam 统计数据暂时没有加载成功:可能是 Steam 接口超时、游戏库隐私设置为私密或插件配置有误,稍后刷新重试。'"
|
||||||
|
></p>
|
||||||
|
|
||||||
<div class="wi-steam__section" th:if="${recentGames != null and !recentGames.isEmpty()}">
|
<div class="wi-steam__section" th:if="${recentGames != null and !recentGames.isEmpty()}">
|
||||||
<h3 class="wi-steam__section-title" th:text="'最近游玩'">最近游玩</h3>
|
<h3 class="wi-steam__section-title" th:text="'最近游玩'">最近游玩</h3>
|
||||||
@@ -111,8 +116,10 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
<span
|
<span
|
||||||
class="wi-steam__recent-achievements"
|
class="wi-steam__recent-achievements"
|
||||||
th:if="${game.achievementProgressText != null}"
|
th:if="${game.achievementProgressText != null}"
|
||||||
th:text="${game.achievementProgressText}"
|
>
|
||||||
></span>
|
<svg class="wi-steam__achieve-icon" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 9H4.5a2.5 2.5 0 0 1 0-5H6"/><path d="M18 9h1.5a2.5 2.5 0 0 0 0-5H18"/><path d="M4 22h16"/><path d="M10 14.66V17c0 .55-.47.98-.97 1.21C7.85 18.75 7 20.24 7 22"/><path d="M14 14.66V17c0 .55.47.98.97 1.21C16.15 18.75 17 20.24 17 22"/><path d="M18 2H6v7a6 6 0 0 0 12 0V2Z"/></svg>
|
||||||
|
<span th:text="${game.achievementProgressText}"></span>
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
@@ -331,6 +338,9 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
border: 1px solid var(--rule);
|
border: 1px solid var(--rule);
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
min-height: 80px;
|
min-height: 80px;
|
||||||
|
/* 容器查询的容器必须是被查询元素的祖先:
|
||||||
|
放在 .wi-steam__stat-value 自身上时 @container 永远不命中 */
|
||||||
|
container-type: inline-size;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wi-steam__stat-value {
|
.wi-steam__stat-value {
|
||||||
@@ -342,7 +352,6 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
container-type: inline-size;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@container (max-width: 120px) {
|
@container (max-width: 120px) {
|
||||||
@@ -456,6 +465,8 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
|
|
||||||
.wi-steam__recent-meta {
|
.wi-steam__recent-meta {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
font-size: var(--text-xs);
|
font-size: var(--text-xs);
|
||||||
color: var(--ink-3);
|
color: var(--ink-3);
|
||||||
@@ -466,8 +477,25 @@ import Layout from "../layouts/Layout.astro";
|
|||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 成就进度固定靠右展示,带奖杯标识 */
|
||||||
.wi-steam__recent-achievements {
|
.wi-steam__recent-achievements {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
color: #f59e0b;
|
color: #f59e0b;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wi-steam__achieve-icon {
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 统计数据加载失败时的提示 */
|
||||||
|
.wi-steam__stats-hint {
|
||||||
|
margin: calc(-1 * var(--space-sm)) 0 var(--space-2xl);
|
||||||
|
font-size: var(--text-xs);
|
||||||
|
color: var(--ink-3);
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wi-steam__games-grid {
|
.wi-steam__games-grid {
|
||||||
|
|||||||
@@ -102,7 +102,8 @@
|
|||||||
&:focus {
|
&:focus {
|
||||||
outline: none;
|
outline: none;
|
||||||
border-color: var(--accent);
|
border-color: var(--accent);
|
||||||
box-shadow: 0 0 0 3px rgba(212, 118, 78, 0.15);
|
/* 跟随当前配色/自定义强调色,不再硬编码默认赤陶色 */
|
||||||
|
box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
&::placeholder {
|
&::placeholder {
|
||||||
@@ -198,7 +199,7 @@ html.dark .halo-comment-widget {
|
|||||||
.comment-input,
|
.comment-input,
|
||||||
.comment-textarea {
|
.comment-textarea {
|
||||||
&:focus {
|
&:focus {
|
||||||
box-shadow: 0 0 0 3px rgba(232, 149, 95, 0.15);
|
box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -196,7 +196,10 @@ table {
|
|||||||
z-index: 1;
|
z-index: 1;
|
||||||
background-color: var(--bg);
|
background-color: var(--bg);
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
/* clip 与 hidden 同样裁掉横向溢出,但不会把元素变成滚动容器,
|
||||||
|
避免内容底部的弹层(如评论区翻页下拉)被纵向裁掉 */
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
|
overflow-x: clip;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wi-main--wide.wi-main--home {
|
.wi-main--wide.wi-main--home {
|
||||||
@@ -207,6 +210,7 @@ table {
|
|||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
|
overflow-x: clip;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wi-content-wrap {
|
.wi-content-wrap {
|
||||||
@@ -214,6 +218,7 @@ table {
|
|||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding-inline: clamp(1rem, 3vw, 2rem);
|
padding-inline: clamp(1rem, 3vw, 2rem);
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
|
overflow-x: clip;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wi-content-wrap--wide {
|
.wi-content-wrap--wide {
|
||||||
|
|||||||
+1
-1
@@ -28,7 +28,7 @@ spec:
|
|||||||
description: 微信读书书架(依赖微信读书插件)
|
description: 微信读书书架(依赖微信读书插件)
|
||||||
screenshot:
|
screenshot:
|
||||||
file: weread.html
|
file: weread.html
|
||||||
version: "1.2.1"
|
version: "1.2.2"
|
||||||
requires: ">=2.26.0"
|
requires: ">=2.26.0"
|
||||||
license:
|
license:
|
||||||
- name: "GPL-3.0"
|
- name: "GPL-3.0"
|
||||||
|
|||||||
Reference in new issue
Block a user