Skip to content

fix(Log): CI Tooltip 各检查项状态图标按通过/失败/运行中上色#40

Merged
ThreeFish-AI merged 1 commit into
feature/1.x.xfrom
ThreeFish-AI/log-ci-tooltip-color
Jun 30, 2026
Merged

fix(Log): CI Tooltip 各检查项状态图标按通过/失败/运行中上色#40
ThreeFish-AI merged 1 commit into
feature/1.x.xfrom
ThreeFish-AI/log-ci-tooltip-color

Conversation

@ThreeFish-AI

Copy link
Copy Markdown
Owner

背景

PR #37 合入后,Log 视图 CI 状态 Tooltip 内每项检查的状态图标呈单色(灰色),无法区分通过/失败/运行中——如下图:失败的 Quality Gate 与通过的 Test Coverage / SonarQube 图标颜色一致,仅头部汇总图标有红色。

根因

tipGlyph() 返回的是裸 <svg>,缺少 .g-{state} 上色包裹。CSS 颜色规则(#ci-tip .g-success/.g-failure/.g-pending)作用于该包裹类,因此只有头部(包了 <span class="g g-failure">)上色,各检查行图标继承前景色呈灰色单色。

修复

tipGlyph() 统一包裹 <span class="g g-{state}">,每项检查图标按状态上色,与头部及 Log 主行图标语义一致:

状态 图标 颜色
通过 绿(testing.iconPassed
未通过 红(testing.iconFailed
运行中 旋转圆环 黄(testing.iconQueued
未知/跳过 短横 灰(descriptionForeground

并补充缺失的 .g-unknown CSS 类。运行中(pending)状态现在在 Tooltip 每行也以黄色旋转图标呈现,与 Log 主行一致。

变更

验证

🤖 Generated with Claude Code

tipGlyph 此前返回裸 SVG,缺少 .g-{state} 包裹,导致 Tooltip 内每项检查图标
继承前景色呈单色(仅头部图标上色)。现统一包裹:绿=通过、红=失败、黄=运行中、
灰=未知,与头部及 Log 行图标语义一致。

🤖 Generated with [Claude Code](https://github.com/claude), [CodeX](https://openai.com), [Gemini](https://github.com/apps/gemini-code-assist)
Co-Authored-By: Aurelius Huang<threefish.ai@gmail.com>
@ThreeFish-AI ThreeFish-AI merged commit 31b590a into feature/1.x.x Jun 30, 2026
5 checks passed
@ThreeFish-AI ThreeFish-AI deleted the ThreeFish-AI/log-ci-tooltip-color branch June 30, 2026 07:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant