{ "motion": { "runtimeTransitionAll": 0, "runtimeMaxHeight999": 0, "hover": { "before": "none", "after": "matrix(1, 0, 0, 1, 0, -1)", "shadow": "rgba(16, 24, 40, 0.06) 0px 2px 8px -2px, rgba(16, 24, 40, 0.06) 0px 0px 0px 1px" }, "hoverMatrix": "matrix(1, 0, 0, 1, 0, -1)", "roll": { "total": 4, "rolling": [ "23", "80", "41" ], "duration": "kf-roll 0.65s cubic-bezier(0.4, 0, 0.2, 1)" }, "staggerDelays": [ { "y": 164, "delay": "0s", "dur": "0.4s" }, { "y": 164, "delay": "0.04s", "dur": "0.4s" }, { "y": 164, "delay": "0.08s", "dur": "0.4s" }, { "y": 164, "delay": "0.12s", "dur": "0.4s" }, { "y": 164, "delay": "0.16s", "dur": "0.4s" } ], "staggerRows": 5, "detailRows": { "closed": "20px 0px", "open": "20px 41.5938px" }, "reducedDurations": [ "1e-05s", "anim:1e-05s" ] }, "examples": [ { "no": "A1", "name": "transition: all", "hits": [], "count": 0 }, { "no": "A2", "name": "max-height: 999px 展开动画", "hits": [], "count": 0 }, { "no": "A3", "name": "hover 时 scale > 1(静态)", "hits": [], "count": 0, "note": "源码里出现的 scale(0.985) 是按下时的缩小,不是 hover 放大" }, { "no": "A5", "name": "列表进场错峰 40ms(animation-delay: calc(var(--i) * 40ms))", "hits": [ { "file": "src/styles/tokens.js", "line": 438, "text": ".kf-enter { animation: kf-enter 400ms cubic-bezier(0.16, 1, 0.3, 1) both; animation-delay:" } ], "count": 1 }, { "no": "A6", "name": "展开收起 grid-template-rows: 0fr → 1fr", "hits": [ { "file": "src/pages/report-card.js", "line": 73, "text": ".rc .detail { display: grid; grid-template-rows: 0fr; row-gap: 0; column-gap: 0; opacity: " } ], "count": 1 }, { "no": "A7", "name": "prefers-reduced-motion 关闭动效", "hits": [ { "file": "src/components/kf-glass-card.js", "line": 59, "text": "@media (prefers-reduced-motion: reduce) { :host([lift]) .frame::before { display: none; } " }, { "file": "src/layout/kf-app.js", "line": 455, "text": "/* 关闭动效:动画本身(不只 0.01ms 的时长)一起关掉 —— prefers-reduced-motion 与 data-motion=\"off\" 都走这条 */" }, { "file": "src/layout/kf-app.js", "line": 456, "text": "@media (prefers-reduced-motion: reduce) { :host::before, :host::after { animation: none; }" }, { "file": "src/styles/tokens.js", "line": 480, "text": "@media (prefers-reduced-motion: reduce) {" } ], "count": 4 }, { "no": "A4", "name": "数字滚动时长声明", "hits": [ { "file": "src/components/kf-stat.js", "line": 63, "text": "animation: kf-roll 650ms cubic-bezier(0.4, 0, 0.2, 1) both; }" } ], "count": 1 }, { "no": 1, "name": "装饰性渐变 / 渐变文字标题", "hit": false, "evidence": "渐变文字(background-clip:text):0 处。装饰渐变只出现在玻璃边(--kf-edge,135/160deg 发丝边)与光场底色,不是标题上的花活;被删过的那处「条形蓝→紫渐变」可在 git 历史里看到。", "verdict": "未命中" }, { "no": 2, "name": "glow 光晕 / blob 色块 / 条纹纹理 / 网格背景", "hit": false, "evidence": "blur 光晕(非 0 扩散的发光 box-shadow)运行时 0 处;conic 渐变 0 处;背景光场是 kf-app::before 上 5 个 radial-gradient(项目设计基色,static 动画 64s),不是装饰性 blob。", "verdict": "未命中" }, { "no": 3, "name": "玻璃效果用在所有卡片上", "hit": true, "evidence": "内容卡 kf-glass-card 仍是「白面 .72 + blur(8px)」的玻璃层(view-workbench.js:172-173 的 .grid2 两张卡、各页 .gcard / .filters、机会卡外壳都是它);真正的浮层(导航 aside.side.kf-glass.is-panel、kf-drawer、筛选 sheet)也是玻璃。即:玻璃没有限定在浮层。", "verdict": "可接受(暂不修):要把内容卡换成实白面属于视觉改版,v11c 任务书明确「不是视觉改版」,留到下一轮视觉任务" }, { "no": 4, "name": "彩色左边框告警条", "hit": false, "evidence": ".alert 已改成 6% 染色 + 1px 同色描边(tokens.js 的 .alert 规则),运行时 border-left-color ≠ border-top-color 的元素:0 处。", "verdict": "未命中" }, { "no": 5, "name": "emoji 当图标(应使用 SVG)", "hit": false, "evidence": "图标全部来自 components/icons.js 的 SVG 路径(24×24 stroke 1.9);emoji 命中的元素只算到文字里的「→」「·」这类标点,不算 emoji。", "verdict": "未命中" }, { "no": 6, "name": "max-height:999px 展开动画", "hit": false, "evidence": "grep max-height: 9999?px → 0 处(无);展开用 grid-template-rows: 0fr → 1fr(report-card.js)。", "verdict": "未命中" }, { "no": 7, "name": "transition: all", "hit": false, "evidence": "源码 0 处;运行时 0 个元素 computed transition-property 为 all(共扫描 405 个带过渡的元素)。", "verdict": "未命中" }, { "no": 8, "name": "阴影超过 3 档", "hit": false, "evidence": "令牌层 --elev-1/2/3 共 3 档(--sh-* 只是基本量,--ring-1 是 1px 描边层,组件只引用语义名);运行时静止 + 悬停态的阴影几何共 4 种(已剥掉颜色):C0px1px2px0px | C0px0px0px1px | C0px12px32px-8px | C0px-12px32px-8px;落在三档之外的 0 种。", "verdict": "未命中" }, { "no": 9, "name": "纯 #000 / #FFF", "hit": false, "evidence": "computed color / background 为纯黑 rgb(0,0,0) 的元素:0 处;纯白 #FFF 只用于深色底上的反白文字(--kf-ink-inv),0 处元素背景为纯白。", "verdict": "未命中" }, { "no": 10, "name": "所有间距都是同一个值(均匀呼吸)", "hit": false, "evidence": "版式距离(卡内 / 卡间 / 区块间)实测 4 种:16 / 12 / 24 / 48 四级,不是同一个值(详见 audit-spacing.mjs 输出)。", "verdict": "未命中" }, { "no": 11, "name": "box-shadow 做凸起 / 凹陷(非克制的拟物)", "hit": false, "evidence": "凸起 / 凹陷拟物:inset 阴影只保留 --kf-hi(两条 1px 内高光,tokens.js:143)与抽屉顶边的柔光;3D 拟物阴影 0 处。", "verdict": "未命中" }, { "no": 12, "name": "加班式 hover:跳动 > 2px、放大", "hit": false, "evidence": "真实指针悬停后 transform:matrix(1, 0, 0, 1, 0, -1) —— matrix 的平移分量是 -1px,缩放分量是 1(没有放大);静止态 none。", "verdict": "未命中" }, { "no": 13, "name": "圆角 > 16px", "hit": true, "evidence": "运行时圆角最大值 50px(令牌 --kf-radius: 16px;超过 16 的只有圆形头像 / 环这类「必须圆」的元素:4 个)。", "verdict": "可接受(圆形头像 / 进度环,不是设计圆角)" }, { "no": 14, "name": "强调色面积 > 5%", "hit": false, "evidence": "工作台整屏截图里接近强调色(#5B5BD6 系:蓝 >> 红、R≈G)的像素占比 0.36%(采样基准:1440×960 整页首屏)。", "verdict": "未命中" }, { "no": 15, "name": "所有卡片同时入场无错峰", "hit": false, "evidence": ".kf-enter 的 animation-delay 实测取值:[[\"0s\",\"0.04s\",\"0.08s\",\"0.12s\",\"0.16s\",\"0.2s\"],[\"0s\"],[\"0s\",\"0.04s\",\"0.08s\",\"0.12s\",\"0.16s\"]](--i × 40ms 阶梯;kf-app 还会把首屏外元素挂 pending,滚到再播)。", "verdict": "未命中" } ], "meta": { "routes": [ "/", "/pool", "/reports", "/reports/voc", "/members", "/ledger", "/stages" ], "filesScanned": 61 } }