Skip to content

Comments

feat(dialog): 添加变量处理#3172

Merged
oasis-cloud merged 1 commit intojdf2e:feat_v3.xfrom
xiaoyatong:feat3/dialog-css
Apr 11, 2025
Merged

feat(dialog): 添加变量处理#3172
oasis-cloud merged 1 commit intojdf2e:feat_v3.xfrom
xiaoyatong:feat3/dialog-css

Conversation

@xiaoyatong
Copy link
Collaborator

@xiaoyatong xiaoyatong commented Apr 11, 2025

🤔 这个变动的性质是?

  • 新特性提交
  • 日常 bug 修复
  • 站点、文档改进
  • 演示代码改进
  • 组件样式/交互改进
  • TypeScript 定义更新
  • 包体积优化
  • 性能优化
  • 功能增强
  • 国际化改进
  • 重构
  • 代码风格优化
  • 测试用例
  • 分支合并
  • 其他改动(是关于什么的改动?)

🔗 相关 Issue

💡 需求背景和解决方案

☑️ 请求合并前的自查清单

⚠️ 请自检并全部勾选全部选项⚠️

  • 文档已补充或无须补充
  • 代码演示已提供或无须提供
  • TypeScript 定义已补充或无须补充
  • fork仓库代码是否为最新避免文件冲突
  • Files changed 没有 package.json lock 等无关文件

Summary by CodeRabbit

  • 新功能
    • 为对话框组件的取消按钮新增了背景色定制选项,用户现在可以通过设置自定义变量灵活调整按钮背景色,从而提升整体视觉体验。
  • 文档
    • 更新了对话框组件的相关说明,新增了用于控制取消按钮背景色的变量信息,并标明了默认值,方便用户进行个性化定制。

@coderabbitai
Copy link

coderabbitai bot commented Apr 11, 2025

Walkthrough

此次 PR 对对话框组件的样式进行了调整,主要为取消按钮新增了背景设置。通过在 SCSS 文件中引入变量 $dialog-footer-cancel-bg,并在文档中同步添加了对应的 CSS 变量 --nutui-dialog-footer-cancel-bg,使取消按钮的背景颜色可以定制化。与此同时,在相关变量配置文件中也同步更新了定义和默认值。

Changes

文件 变更说明
src/packages/dialog/dialog.scss .nut-dialog-footer-cancel 类新增了 background: $dialog-footer-cancel-bg; 属性。
src/packages/dialog/doc*.md 在各文档中新增 CSS 变量 --nutui-dialog-footer-cancel-bg(部分文件为转义形式),默认值为 transparent,用于定制取消按钮背景。
src/styles/variables*.scss 新增 SCSS 变量 $dialog-footer-cancel-bg,分别在不同文件中定义,提供对应的默认回退值。

Possibly related PRs

Suggested reviewers

  • oasis-cloud

Poem

我是一只快乐的小兔,
跳跃在代码的绿野间。
新增的背景色如春夜星光,
为取消按钮披上了亮丽的彩衣。
🐰代码美梦,与你同行!

Tip

⚡💬 Agentic Chat (Pro Plan, General Availability)
  • We're introducing multi-step agentic chat in review comments and issue comments, within and outside of PR's. This feature enhances review and issue discussions with the CodeRabbit agentic chat by enabling advanced interactions, including the ability to create pull requests directly from comments and add commits to existing pull requests.

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai generate unit testing code for this file.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and generate unit testing code.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai generate docstrings to generate docstrings for this PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai plan to trigger planning for file edits and PR creation.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@github-actions github-actions bot added action:review This PR needs more reviews (less than 2 approvals) 3.x Target branch 3.x labels Apr 11, 2025
@codecov
Copy link

codecov bot commented Apr 11, 2025

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 87.20%. Comparing base (79a9900) to head (6d8c6ef).
Report is 1 commits behind head on feat_v3.x.

Additional details and impacted files
@@            Coverage Diff             @@
##           feat_v3.x    #3172   +/-   ##
==========================================
  Coverage      87.20%   87.20%           
==========================================
  Files            279      279           
  Lines          18540    18540           
  Branches        2822     2822           
==========================================
  Hits           16167    16167           
  Misses          2368     2368           
  Partials           5        5           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 0

🧹 Nitpick comments (1)
src/packages/dialog/dialog.scss (1)

130-133: 新增取消按钮背景变量的使用

.nut-dialog-footer-cancel样式中增加了 background: $dialog-footer-cancel-bg;,使取消按钮的背景色可以通过 SCSS 变量进行定制化。请确认这项改动与文档中对 CSS 变量 --nutui-dialog-footer-cancel-bg 的描述保持一致,并验证不同主题下的显示效果。

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 79a9900 and 6d8c6ef.

📒 Files selected for processing (7)
  • src/packages/dialog/dialog.scss (1 hunks)
  • src/packages/dialog/doc.en-US.md (1 hunks)
  • src/packages/dialog/doc.md (1 hunks)
  • src/packages/dialog/doc.taro.md (1 hunks)
  • src/packages/dialog/doc.zh-TW.md (1 hunks)
  • src/styles/variables-jmapp.scss (1 hunks)
  • src/styles/variables.scss (1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (1)
  • GitHub Check: test
🔇 Additional comments (6)
src/packages/dialog/doc.en-US.md (1)

162-162: 新增 CSS 变量描述无误
这一行成功新增了 CSS 变量 --nutui-dialog-footer-cancel-bg,并明确标明默认值为 transparent。请确保描述与其他文档中保持一致。

src/packages/dialog/doc.md (1)

162-162: 新增 CSS 变量记录正确
该行文档中准确地介绍了新增加的变量 --nutui-dialog-footer-cancel-bg,并说明其默认值为 transparent,符合预期。建议检查其它描述部分与设计文档的一致性。

src/styles/variables-jmapp.scss (1)

1467-1467: SCSS 变量定义正确
在此处新增的 $dialog-footer-cancel-bg 变量通过 var(--nutui-dialog-footer-cancel-bg, transparent) 正确地引用了对应的 CSS 变量,并提供了合适的默认值。建议保持与其它变量定义的一致命名和格式。

src/packages/dialog/doc.taro.md (1)

142-142: Taro 文档中新增 CSS 变量显示正确
这行代码准确反映了新变量 --nutui-dialog-footer-cancel-bg 的用途和默认值 transparent,确保了在 Taro 平台下文档的一致性。

src/packages/dialog/doc.zh-TW.md (1)

162-162: 繁體中文文檔中新增變量描述正確
此處正確地記錄了 CSS 變量 --nutui-dialog-footer-cancel-bg,並指出預設值為 transparent。請確認此描述與其他語言版本保持一致。

src/styles/variables.scss (1)

1358-1365: 新增并配置取消按钮背景变量

这里新增了变量 $dialog-footer-cancel-margin-right 以及 $dialog-footer-cancel-bg

  • $dialog-footer-cancel-margin-right 使用 CSS 变量 --nutui-dialog-footer-cancel-margin-right 默认值为 12px
  • $dialog-footer-cancel-bg 通过 CSS 变量 --nutui-dialog-footer-cancel-bg 获取背景色,默认回退为 $button-default-background-color(而 $button-default-background-color 默认定义为 transparent)。

建议检查文档说明,确保默认值与预期一致,并且在所有相关文档(如 doc.en-US.md、doc.zh-TW.md 等)中同步更新该 CSS 变量的描述。

@oasis-cloud oasis-cloud merged commit 22905b5 into jdf2e:feat_v3.x Apr 11, 2025
8 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

3.x Target branch 3.x action:review This PR needs more reviews (less than 2 approvals) size/S

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants