Skip to content

fix(theme): adjust dark mode tooltip colors for support button - #649

Merged
deepin-bot[bot] merged 1 commit into
linuxdeepin:release/eaglefrom
GongHeng2017:202609021630-re-eagle-fix
Sep 2, 2026
Merged

deepin-bot[bot] merged 1 commit into
linuxdeepin:release/eaglefrom
GongHeng2017:202609021630-re-eagle-fix

Conversation

@GongHeng2017

@GongHeng2017 GongHeng2017 commented Sep 2, 2026

Copy link
Copy Markdown
Contributor

Change tooltip font color to #FFFFFF and background to #141414 in dark mode for better readability. Sync built web_dist output.

调整深色模式下"服务与支持"提示框字体颜色为#FFFFFF、背景为#141414,
提升可读性。同步编译产物 web_dist。

Log: 调整深色模式服务与支持提示框颜色
PMS: BUG-243239
Influence: 深色模式下"服务与支持"按钮 tooltip 字体及背景颜色调整,
提升显示效果。

Summary by Sourcery

Improve dark-mode support-button tooltip contrast and synchronize the generated web output.

Bug Fixes:

  • Improve dark-mode support-button tooltip readability by using white text on a dark #141414 background.

Chores:

  • Synchronize the compiled web_dist output with the source changes.

@sourcery-ai

sourcery-ai Bot commented Sep 2, 2026

Copy link
Copy Markdown
Reviewer's guide (collapsed on small PRs)

Reviewer's Guide

Dark mode styling is updated for improved support-button tooltip readability, with source changes and generated web_dist output synchronized; reviewers should verify that the generated bundle applies the same variables as the source.

Flow diagram for dark mode support tooltip styling

flowchart LR
    DarkMode[Dark mode active] --> AppSet[App.js setProperty]
    AppSet --> TooltipVars[nav-hove-word-color #FFFFFF<br/>tips-background-color #141414]
    TooltipVars --> SupportTooltip[Support button tooltip]
    AppSet --> BuiltBundle[web_dist index.js]
    BuiltBundle --> BundleVars[Generated tooltip variables]
Loading

File-Level Changes

Change Details Files
Update dark-mode tooltip and hover text colors in the source implementation.
  • Set hover text color to #FFFFFF.
  • Set tooltip background color to #141414.
src/web/toManual/js/App.js
Synchronize the generated web distribution output with the dark-mode color changes.
  • Update the generated hover text color to #FFFFFF.
  • Adjust the generated dark-mode search-context color to #141414; verify this corresponds to the intended tooltip background change.
  • Confirm generated tooltip background remains aligned with the source value.
src/web_dist/toManual/index.js

Tips and commands

Interacting with Sourcery

  • Trigger a new review: Comment @sourcery-ai review on the pull request.
  • Continue discussions: Reply directly to Sourcery's review comments.
  • Generate a GitHub issue from a review comment: Ask Sourcery to create an
    issue from a review comment by replying to it. You can also reply to a
    review comment with @sourcery-ai issue to create an issue from it.
  • Generate a pull request title: Write @sourcery-ai anywhere in the pull
    request title to generate a title at any time. You can also comment
    @sourcery-ai title on the pull request to (re-)generate the title at any time.
  • Generate a pull request summary: Write @sourcery-ai summary anywhere in
    the pull request body to generate a PR summary at any time exactly where you
    want it. You can also comment @sourcery-ai summary on the pull request to
    (re-)generate the summary at any time.
  • Generate reviewer's guide: Comment @sourcery-ai guide on the pull
    request to (re-)generate the reviewer's guide at any time.
  • Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
    pull request to resolve all Sourcery comments. Useful if you've already
    addressed all the comments and don't want to see them anymore.
  • Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
    request to dismiss all existing Sourcery reviews. Especially useful if you
    want to start fresh with a new review - don't forget to comment
    @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

  • Enable or disable review features such as the Sourcery-generated pull request
    summary, the reviewer's guide, and others.
  • Change the review language.
  • Add, remove or edit custom review instructions.
  • Adjust other review settings.

Getting Help

@sourcery-ai sourcery-ai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey - I've found 2 issues

Prompt for AI Agents
Please address the comments from this code review:

## Individual Comments

### Comment 1
<location path="src/web_dist/toManual/index.js" line_range="733" />
<code_context>
                     document.documentElement.style.setProperty('--search-WikiSearch-color', '#6D7C88');
                     document.documentElement.style.setProperty('--search-itemTitle-word-color', '#C0C6D4');
-                    document.documentElement.style.setProperty('--search-context-word-color', '#6D7C88');
+                    document.documentElement.style.setProperty('--search-context-word-color', '#141414');
                     document.documentElement.style.setProperty('--tips-background-color', 'rgba(42, 42, 42, 0.8)');
                     document.documentElement.style.setProperty('--tips-border-color', 'rgba(0, 0, 0, 0.3)');
</code_context>
<issue_to_address>
**issue (broader_impact):** The shipped `web_dist` bundle leaves `--tips-background-color` at `rgba(42, 42, 42, 0.8)` instead of the source value `#141414`, so users loading the built web output do not receive the dark-mode tooltip background fix.

**Triggers:** When the application runs from the checked-in `web_dist` bundle in dark mode.

**Suggested fix:** Regenerate `src/web_dist/toManual/index.js` so its dark-mode `--tips-background-color` assignment is `#141414`.
</issue_to_address>

### Comment 2
<location path="src/web_dist/toManual/index.js" line_range="733" />
<code_context>
                     document.documentElement.style.setProperty('--search-WikiSearch-color', '#6D7C88');
                     document.documentElement.style.setProperty('--search-itemTitle-word-color', '#C0C6D4');
-                    document.documentElement.style.setProperty('--search-context-word-color', '#6D7C88');
+                    document.documentElement.style.setProperty('--search-context-word-color', '#141414');
                     document.documentElement.style.setProperty('--tips-background-color', 'rgba(42, 42, 42, 0.8)');
                     document.documentElement.style.setProperty('--tips-border-color', 'rgba(0, 0, 0, 0.3)');
</code_context>
<issue_to_address>
**issue (bug_risk):** The built bundle changes the dark-mode search context text color to `#141414`, while the search context is rendered on a dark background, making search-result excerpts effectively unreadable.

**Triggers:** When a user views search results in dark mode using the built web output.

**Suggested fix:** Regenerate the bundle from the source and restore the dark-mode `--search-context-word-color` value to `#6D7C88`.
</issue_to_address>

Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.

Comment thread src/web_dist/toManual/index.js Outdated
Comment thread src/web_dist/toManual/index.js Outdated
@GongHeng2017
GongHeng2017 force-pushed the 202609021630-re-eagle-fix branch from 0ab84ee to 6cdf603 Compare September 2, 2026 09:09
Change tooltip font color to #FFFFFF and background to #141414 in
dark mode for better readability. Sync built web_dist output.

调整深色模式下"服务与支持"提示框字体颜色为#FFFFFF、背景为#141414,
提升可读性。同步编译产物 web_dist。

Log: 调整深色模式服务与支持提示框颜色
PMS: BUG-243239
Influence: 深色模式下"服务与支持"按钮 tooltip 字体及背景颜色调整,
提升显示效果。
@GongHeng2017
GongHeng2017 force-pushed the 202609021630-re-eagle-fix branch from 6cdf603 to 9d3ca0c Compare September 2, 2026 09:29
@deepin-ci-robot

Copy link
Copy Markdown

deepin pr auto review

🤖 AI 代码审查报告

总体评分: 98 分 (通过阈值: 70分)

Pass


📊 总体评价

项目 结果
审查结论 代码审查通过
评分详情 总体评分 98 分,大于 70 分通过阈值,代码质量符合要求。本次变更仅涉及暗色模式下的 CSS 颜色值调整,变更范围小且目的明确,无安全风险。

🔍 详细分析

1. 语法逻辑 ✅

评价: 优秀 ✅ 通过

潜在问题:
✅ 未发现明显问题

建议: 语法正确,逻辑清晰。本次变更仅修改 CSS 自定义属性的值(颜色值),不涉及任何逻辑流程变更,语法完全正确。


2. 代码质量 ✅

评价: 优秀 ✅ 通过

潜在问题:

  1. src/web/toManual/js/App.js:607 - 暗色模式颜色值变更缺少注释说明变更原因
  2. src/web_dist/toManual/index.js:731 - 手动修改编译产物(web_dist 目录),可能被构建流程覆盖

建议: 1.建议确认项目是否有构建流程,若有则仅需修改源码 src/web/toManual/js/App.js,构建后自动生成 dist 文件
2.建议在颜色值变更处添加简要注释说明设计意图,如 // 暗色模式下使用纯白色提高悬停文字对比度


3. 代码性能 ✅

评价: 优秀 ✅ 通过

潜在问题:
✅ 未发现明显问题

建议: 性能良好,资源使用合理。CSS 自定义属性值变更不影响性能,浏览器渲染开销无变化。


4. 代码安全 🔒

评价: 优秀 ✅ 通过

🔐 发现 0 个安全漏洞

安全漏洞详情:
✅ 未发现安全漏洞

建议: 存在0个安全漏洞。本次变更仅涉及硬编码 CSS 颜色值,无用户输入处理,无安全风险。


💡 改进建议代码示例

// 建议在源码中添加注释说明颜色变更意图
// 暗色模式主题设置
document.documentElement.style.setProperty('--nav-hove-word-color', '#FFFFFF'); // 纯白色提高悬停文字对比度
document.documentElement.style.setProperty('--tips-background-color', '#141414'); // 不透明深色背景,提升 tooltip 可读性

本报告由 AI 代码审查工具自动生成

@deepin-ci-robot

Copy link
Copy Markdown

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by: GongHeng2017, max-lvs

The full list of commands accepted by this bot can be found here.

Details Needs approval from an approver in each of these files:

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

@GongHeng2017

Copy link
Copy Markdown
Contributor Author

/forcemerge

@deepin-bot
deepin-bot Bot merged commit 9da74a6 into linuxdeepin:release/eagle Sep 2, 2026
14 checks passed
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.

3 participants