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.

Sign up for GitHub

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

Jump to bottom

[joy-ui][Button] Fix the text wrap issue #38696

Merged
merged 6 commits into from
Oct 9, 2023
Merged

[joy-ui][Button] Fix the text wrap issue #38696

merged 6 commits into from
Oct 9, 2023

Conversation

atharva3333
Copy link
Contributor

@atharva3333 atharva3333 commented Aug 29, 2023 •
edited by siriwatknp
Loading

@mui-bot
Copy link

mui-bot commented Aug 29, 2023 •
edited
Loading

Netlify deploy preview

https://deploy-preview-38696--material-ui.netlify.app/

Bundle size report

Details of bundle changes (Toolpad)
Details of bundle changes

Generated by 🚫 dangerJS against 9a2a246

@zannager zannager added component: button This is the name of the generic UI component, not the React module! package: joy-ui Specific to @mui/joy labels Aug 29, 2023
@zannager zannager requested a review from siriwatknp August 29, 2023 11:10
@danilo-leal danilo-leal changed the title [Joy-UI][Button]:Fix Text wrap issue[#38675] [joy-ui][Button] Fix the text wrap issue Aug 29, 2023
@danilo-leal danilo-leal requested a review from zanivan August 29, 2023 11:27
@zanivan
Copy link
Contributor

zanivan commented Aug 31, 2023 •
edited
Loading

Thanks for the submission @atharva3333! I changed the lineHeight for theme.vars.lineHeight.md instead of a int value. @siriwatknp, can you check if it's everything right?

@atharva3333 atharva3333 closed this Sep 7, 2023
@siriwatknp
Copy link
Member

siriwatknp commented Sep 12, 2023 •
edited
Loading

Why this is closed? @atharva3333 would you like to submit a PR again?

@atharva3333 atharva3333 reopened this Sep 12, 2023
@atharva3333
Copy link
Contributor Author

Hey @siriwatknp I have reopen the pull request

@rahul9852-dot
Copy link

Hello, I'm new to open source. If this issue persists, I'd like to contribute @siriwatknp.

@siriwatknp
Copy link
Member

@zanivan Should the line-height for the button use md or sm?

@siriwatknp siriwatknp mentioned this pull request Sep 18, 2023
Open
@zanivan
Copy link
Contributor

zanivan commented Sep 18, 2023

@zanivan Should the line-height for the button use md or sm?

I believe we should keep md

@oliviertassinari
Copy link
Member

I feel we miss some padding in this case, right now this feels a bit too close to the top

Screenshot 2023-09-18 at 23 06 58

Better?

Screenshot 2023-09-18 at 23 08 12

@oliviertassinari oliviertassinari added the design: joy This is about Joy Design, please involve a visual or UX designer in the process label Sep 18, 2023
@zanivan
Copy link
Contributor

zanivan commented Sep 19, 2023

I feel we miss some padding in this case, right now this feels a bit too close to the top

I think we should do so—it fits better with the line-height!

siriwatknp
siriwatknp approved these changes Sep 20, 2023
View reviewed changes
Copy link
Member

@siriwatknp siriwatknp left a comment

Choose a reason for hiding this comment

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

👍 Thanks for your first contribution!

@siriwatknp siriwatknp mentioned this pull request Oct 9, 2023
Closed
1 task
siriwatknp
siriwatknp reviewed Oct 9, 2023
View reviewed changes
packages/mui-joy/src/Button/Button.tsx
paddingInline: '1.5rem',
}),
WebkitTapHighlightColor: 'transparent',
boxSizing: 'border-box',
Copy link
Member

Choose a reason for hiding this comment

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

Need to explicitly add this, otherwise, there will be a lot of visual regression changes due to padding/line-height changes.

Material UI also explicitly sets this value.

@siriwatknp siriwatknp merged commit 2936147 into mui:master Oct 9, 2023
mnajdova pushed a commit to mnajdova/material-ui that referenced this pull request Oct 9, 2023
@atharva3333 @mnajdova
[joy-ui][Button] Fix the text wrap issue (mui#38696)
b41064a
This was referenced Oct 20, 2023
Closed
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@siriwatknp siriwatknp siriwatknp approved these changes

@zanivan zanivan Awaiting requested review from zanivan

Assignees
No one assigned
Labels
component: button This is the name of the generic UI component, not the React module! design: joy This is about Joy Design, please involve a visual or UX designer in the process package: joy-ui Specific to @mui/joy
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
7 participants
@atharva3333 @mui-bot @zanivan @siriwatknp @rahul9852-dot @oliviertassinari @zannager