diff --git a/01_content/src/client/styles.ts b/01_content/src/client/styles.ts index b2422f6..6dc2af7 100644 --- a/01_content/src/client/styles.ts +++ b/01_content/src/client/styles.ts @@ -382,7 +382,11 @@ export const css = xtermCss + '\n' + [ '.dsh-wt_subSection{flex:none;padding:6px 8px 2px;font-size:10px;font-weight:600;letter-spacing:.05em;color:var(--dsw-alias-label-tertiary,#6e7683)}', // 控制室面板:项目卡片网格(每行 3 张、超出换行;DSH 简洁 + 苹果式卡片)。 // 主题变量自带作用域:dark 缺省;data-wt-theme=light 换浅色;system 由面板读宿主 color-scheme 落成 dark/light。 - '.dsh-wt_console{--wt-bg:#0a0d13;--wt-card:#171c25;--wt-cardHover:#1d232e;--wt-border:#2a3140;--wt-borderHover:#39445a;--wt-text:#e6e8eb;--wt-text2:#9aa4b2;--wt-text3:#6e7683;--wt-chip:rgba(255,255,255,.06);--wt-grid:rgba(255,255,255,.045);--wt-shadow:0 6px 20px rgba(0,0,0,.35);flex:1;min-height:0;overflow:auto;padding:22px;background-image:linear-gradient(var(--wt-grid) 1px,transparent 1px),linear-gradient(90deg,var(--wt-grid) 1px,transparent 1px);background-size:30px 30px;background-color:var(--wt-bg)}', + '.dsh-wt_console{--wt-bg:#0a0d13;--wt-card:#171c25;--wt-cardHover:#1d232e;--wt-border:#2a3140;--wt-borderHover:#39445a;--wt-text:#e6e8eb;--wt-text2:#9aa4b2;--wt-text3:#6e7683;--wt-chip:rgba(255,255,255,.06);--wt-grid:rgba(255,255,255,.045);--wt-shadow:0 6px 20px rgba(0,0,0,.35);position:relative;flex:1;min-height:0;overflow:auto;padding:22px;background-image:linear-gradient(var(--wt-grid) 1px,transparent 1px),linear-gradient(90deg,var(--wt-grid) 1px,transparent 1px);background-size:30px 30px;background-color:var(--wt-bg)}', + // 面板镜面流光:克制的一条玻璃反光带,每 ~3.2s 从左上方斜扫到右下(纯装饰,点击穿透) + '.dsh-wt_console::before{content:"";position:absolute;inset:-10% -20%;pointer-events:none;z-index:2;background:linear-gradient(115deg,rgba(255,255,255,0) 42%,rgba(255,255,255,.07) 50%,rgba(255,255,255,0) 58%);opacity:0;animation:consoleSweep 3.2s ease-in-out infinite}', + '.dsh-wt_console[data-wt-theme=light]::before{background:linear-gradient(115deg,rgba(255,255,255,0) 42%,rgba(255,255,255,.4) 50%,rgba(255,255,255,0) 58%)}', + '@keyframes consoleSweep{0%{opacity:0;transform:translate(-12%,-12%)}35%{opacity:1}55%{opacity:1}92%,100%{opacity:0;transform:translate(12%,12%)}}', '.dsh-wt_console[data-wt-theme=light]{--wt-bg:#eef1f5;--wt-card:#ffffff;--wt-cardHover:#f7f9fb;--wt-border:#d8dee6;--wt-borderHover:#b9c4d2;--wt-grid:rgba(27,31,36,.07);--wt-text:#1c2128;--wt-text2:#57606a;--wt-text3:#8b949e;--wt-chip:rgba(27,31,36,.07);--wt-shadow:0 6px 20px rgba(31,41,55,.10)}', '.dsh-wt_consoleHead{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-bottom:12px}', '.dsh-wt_consoleTitle{font-size:14px;font-weight:700;line-height:20px;color:var(--wt-text)}', diff --git a/02_process/worklogs/2026-08-16_worktable-v2.md b/02_process/worklogs/2026-08-16_worktable-v2.md index b65a41e..61c1c11 100644 --- a/02_process/worklogs/2026-08-16_worktable-v2.md +++ b/02_process/worklogs/2026-08-16_worktable-v2.md @@ -1381,3 +1381,15 @@ 30% 处 5%→7%、渐隐延长到 60%;浅色 30% 处 .55→.65。 - 验证:构建通过;functional-diag 全 20 STEP ERROR_COUNT: 0。 - 备注:纯客户端改动,F5 即生效;本地 ahead 3 待补推。 + +## 补记(控制室第十三轮:面板镜面流光) + +- 用户需求:控制室主界面加一个周期性的克制动效——像玻璃被擦亮一样,每隔几秒一条光晕 + 从左上角斜扫到右下角,让用户感知面板「在运行」。 +- 实现:.dsh-wt_console::before 镜面流光带(115° 斜向渐变白 7% 光带,inset -10%/-20%); + consoleSweep 关键帧:每 3.2s 一轮,0% 淡出于左上(translate -12%,-12%)→ 35%–55% + 完全显现 → 92% 淡出于右下(translate 12%,12%);ease-in-out 起收克制;pointer-events + 穿透、z-index 2 浮于卡片之上;浅色主题光带白 40%。纯 CSS 零脚本。 +- 验证(probe-batch16):sweepAnim consoleSweep / sweepContent ✓ / sweepDur 3.2s ✓; + functional-diag 全 20 STEP ERROR_COUNT: 0。 +- 备注:纯客户端改动,F5 即生效;本地 ahead 4 待补推。 diff --git a/04_test/probe-batch16.cjs b/04_test/probe-batch16.cjs index 1d6f18f..2c2fd38 100644 --- a/04_test/probe-batch16.cjs +++ b/04_test/probe-batch16.cjs @@ -140,6 +140,10 @@ const sleep = (ms) => new Promise((r) => setTimeout(r, ms)); out.consoleBgImage = conEl ? getComputedStyle(conEl).backgroundImage.slice(0, 60) : null; out.consoleBgSize = conEl ? getComputedStyle(conEl).backgroundSize : null; out.consoleBgColor = conEl ? getComputedStyle(conEl).backgroundColor : null; + var sweep = conEl ? getComputedStyle(conEl, '::before') : null; + out.sweepAnim = sweep ? sweep.animationName : null; + out.sweepContent = sweep ? (sweep.content !== 'none') : null; + out.sweepDur = sweep ? sweep.animationDuration : null; var cards = grid.querySelectorAll('.dsh-wt_consoleCard'); out.cardCount = cards.length; var c0 = cards[0];