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): wrap text by default #28682

Merged
merged 6 commits into from
Dec 12, 2023
Merged

fix(button): wrap text by default #28682

merged 6 commits into from
Dec 12, 2023

Conversation

mapsandapps
Copy link
Contributor

@mapsandapps mapsandapps commented Dec 11, 2023

Issue number: resolves #8700


What is the current behavior?

Button text is truncated by default.

What is the new behavior?

  • Button text wraps by default.

Does this introduce a breaking change?

  • Yes
  • No

Starting in Ionic Framework 7.2, we encouraged developers to opt-in to text wrapping in buttons by setting ion-text-wrap.

This PR is targeting Ionic Framework v8, where text wrapping of buttons will be the default behavior.

This may cause visual changes across apps using Ionic Framework. Buttons with long text may now be taller than before, leading to layout shifts.

If developers wish to prevent text wrapping, they may use the .ion-text-nowrap class.

@github-actions github-actions bot added the package: core @ionic/core package label Dec 11, 2023
Copy link
Contributor Author

Choose a reason for hiding this comment

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

We could add the nowrap class to these buttons so they don't wrap, if that's preferred over updating the snapshots.

Copy link
Member

Choose a reason for hiding this comment

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

I am okay with keeping this. I think we should avoid custom css where possible.

@mapsandapps mapsandapps changed the title fix( button): wrap text by default fix(button): wrap text by default Dec 11, 2023
@mapsandapps mapsandapps marked this pull request as ready for review December 11, 2023 22:13
@mapsandapps mapsandapps requested a review from a team as a code owner December 11, 2023 22:13
@mapsandapps mapsandapps requested review from averyjohnston and removed request for a team December 11, 2023 22:13
Copy link
Member

@brandyscarney brandyscarney left a comment

Choose a reason for hiding this comment

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

This looks great!

BREAKING.md Outdated Show resolved Hide resolved
Copy link
Member

Choose a reason for hiding this comment

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

I am okay with keeping this. I think we should avoid custom css where possible.

Co-authored-by: Brandy Carney <[email protected]>
@mapsandapps mapsandapps merged commit 666a01d into feature-8.0 Dec 12, 2023
44 checks passed
@mapsandapps mapsandapps deleted the FW-4599 branch December 12, 2023 18:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: core @ionic/core package
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants