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: Menu item icon not centered when itemMarginInline is 0 #42426

Merged
merged 2 commits into from
May 17, 2023

Conversation

zzwgh
Copy link
Contributor

@zzwgh zzwgh commented May 17, 2023

[中文版模板 / 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

💡 Background and solution

I was customizing theme with menu item's itemMarginInline to be 0, then I found that the icon is not centered when the menu is collapsed.

reproduction link

It seems like the paddingInline calc logic caused this bug. Don't know why using fontSizeSM here, cause any other font here is LG. The correct calc logic should be calc(50% - ${fontSizeLG / 2}px - ${itemMarginInline}px)

📝 Changelog

Language Changelog
🇺🇸 English fix: Menu item icon not centered when itemMarginInline is 0
🇨🇳 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

🚀 Summary

🤖 Generated by Copilot at 6a2b643

Improve vertical menu style and layout. Adjust the getVerticalStyle function in components/menu/style/vertical.tsx to fix spacing and alignment issues.

🔍 Walkthrough

🤖 Generated by Copilot at 6a2b643

  • Adjust the spacing and alignment of menu items in the vertical mode (link, link)

@github-actions
Copy link
Contributor

  • 🚨 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

@github-actions
Copy link
Contributor

github-actions bot commented May 17, 2023

@codecov
Copy link

codecov bot commented May 17, 2023

Codecov Report

Patch and project coverage have no change.

Comparison is base (2274111) 100.00% compared to head (6a2b643) 100.00%.

Additional details and impacted files
@@            Coverage Diff            @@
##            master    #42426   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          640       640           
  Lines        10868     10841   -27     
  Branches      2959      2945   -14     
=========================================
- Hits         10868     10841   -27     
Impacted Files Coverage Δ
components/menu/style/vertical.tsx 100.00% <ø> (ø)

... and 3 files with indirect coverage changes

☔ View full report in Codecov by Sentry.
📢 Do you have feedback about the report comment? Let us know in this issue.

@afc163 afc163 merged commit ad4dded into ant-design:master May 17, 2023
56 of 57 checks passed
@MadCcc MadCcc mentioned this pull request May 22, 2023
20 tasks
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.

None yet

2 participants