Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(button): resolved spacing issue in rtl buttons icons and labels #48811

Closed
wants to merge 2 commits into from

Conversation

Kritikalpa
Copy link

中文版模板 / Chinese template

🤔 This is a ...

  • New feature
  • Bug fix
  • Site / documentation update
  • Demo update
  • Component style update
  • TypeScript definition update
  • Bundle size optimization
  • Performance optimization
  • Enhancement feature
  • Internationalization
  • Refactoring
  • Code style optimization
  • Test Case
  • Branch merge
  • Workflow
  • Other (about what?)

🔗 Related issue link

Fix #48807

💡 Background and solution

Problem: No spacing between the icon and the button label
image
image
image
image

Solution: Update CSS selector to handle margins for RTL specific classes.

📝 Changelog

Fix button icon and label spacing issue for RTL buttons

Language Changelog
🇺🇸 English Fix button icon and label spacing issue for RTL buttons
🇨🇳 Chinese

☑️ Self-Check before Merge

⚠️ Please check all items below before requesting a reviewing. ⚠️

  • Doc is updated/provided or not needed
  • Demo is updated/provided or not needed
  • TypeScript definition is updated/provided or not needed
  • Changelog is provided or not needed

Copy link

stackblitz bot commented May 7, 2024

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

Copy link
Contributor

github-actions bot commented May 7, 2024

👁 Visual Regression Report for PR #48811 Passed ✅

🎯 Target branch: master (73adedb)
📖 View Full Report ↗︎

🎊 Congrats! No visual-regression diff found.

Copy link
Contributor

github-actions bot commented May 7, 2024

  • 🚨 Please fill changelog in the PR

    • Write with a developer-oriented perspective and narrative method, without describing the details of the repair
    • Describing the problem and the impact on the developer
    • describing the user-first site problem, not your solution
    • Refer: https://ant.design/changelog#501
  • 🚨 请填写 PR 中的 changelog

    • 请用面向开发者的角度叙述方式撰写,不描述修复细节
    • 描述问题和对开发者的影响
    • 描述用户第一现场的问题,而非你的解决方式
    • 参考:https://ant.design/changelog-cn#501

Copy link
Contributor

github-actions bot commented May 7, 2024

Preview is ready

Copy link

codesandbox-ci bot commented May 7, 2024

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Copy link

codecov bot commented May 7, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 100.00%. Comparing base (73adedb) to head (a0f57a5).

Additional details and impacted files
@@            Coverage Diff            @@
##            master    #48811   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          746       746           
  Lines        12994     12994           
  Branches      3411      3411           
=========================================
  Hits         12994     12994           

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

@Wxh16144
Copy link
Member

Wxh16144 commented May 7, 2024

Your response speed is much faster than mine, at first I tried to solve this problem, and found the initial function submission. I feel that some improvements can be made (this point needs to be confirmed with the core members again).

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.

Broken icon margin in RTL button
2 participants