Skip to content

fix: address word-break/overflow-wrap bug - #8487

Merged
mcoker merged 1 commit into
patternfly:mainfrom
mcoker:issue-8484
Jul 8, 2026
Merged

fix: address word-break/overflow-wrap bug#8487
mcoker merged 1 commit into
patternfly:mainfrom
mcoker:issue-8484

Conversation

@mcoker

@mcoker mcoker commented Jul 8, 2026 •
edited by coderabbitai Bot
Loading

Copy link
Copy Markdown
Contributor

fixes #8484

Follow up to a bug from #8438. I incorrectly replaced word-break: break-word with overflow-wrap: break-word, when it should have been replaced with overflow-wrap: anywhere. This PR goes through all of the changes in #8438 and changes any rules that were word-break: break-word to overflow-wrap: anywhere instead.

Note - there are some instances of word-wrap: break-word (word-wrap vs word-break) replaced with overflow-wrap: break-word originally, which is correct, so I left those alone.

Summary by CodeRabbit

  • Bug Fixes
    • Improved text wrapping across multiple UI elements, including modals, alerts, breadcrumbs, menus, tooltips, notifications, progress displays, and wizards.
    • Long or unbroken text now wraps more gracefully in tighter spaces, reducing overflow and layout issues.
    • Updated title and clipboard copy text behavior for better readability when content is constrained.

@mcoker
mcoker requested a review from jcmill July 8, 2026 17:18
@coderabbitai

coderabbitai Bot commented Jul 8, 2026 •
edited
Loading

Copy link
Copy Markdown
Contributor

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Repository UI (base), Organization UI (inherited)

Review profile: CHILL

Plan: Pro

Run ID: c59ba915-3c80-49e2-96bb-e791696de0df

📥 Commits

Reviewing files that changed from the base of the PR and between d63eee3 and df68d68.

📒 Files selected for processing (11)
  • src/patternfly/components/AboutModalBox/about-modal-box.scss
  • src/patternfly/components/Alert/alert.scss
  • src/patternfly/components/Breadcrumb/breadcrumb.scss
  • src/patternfly/components/ClipboardCopy/clipboard-copy.scss
  • src/patternfly/components/Menu/menu.scss
  • src/patternfly/components/ModalBox/modal-box.scss
  • src/patternfly/components/NotificationDrawer/notification-drawer.scss
  • src/patternfly/components/Progress/progress.scss
  • src/patternfly/components/Title/title.scss
  • src/patternfly/components/Tooltip/tooltip.scss
  • src/patternfly/components/Wizard/wizard.scss

Walkthrough

This PR corrects a prior CSS migration error by changing overflow-wrap from break-word back to anywhere (matching original word-break: break-word semantics) across eleven component SCSS files, restoring intended text-wrapping behavior for long unbroken strings.

Changes

Overflow-wrap correction

Layer / File(s) Summary
Modal and tooltip text wrapping
AboutModalBox/about-modal-box.scss, ModalBox/modal-box.scss, Alert/alert.scss, Tooltip/tooltip.scss		 Changes overflow-wrap from break-word to anywhere for modal content/body, alert title/description, and tooltip content.
Interactive element text wrapping
Breadcrumb/breadcrumb.scss, Menu/menu.scss, ClipboardCopy/clipboard-copy.scss		 Changes overflow-wrap from break-word to anywhere for breadcrumb links, menu item descriptions, and clipboard copy text.
Notification drawer and progress text wrapping
NotificationDrawer/notification-drawer.scss, Progress/progress.scss		 Changes overflow-wrap from break-word to anywhere for drawer header title, description, group toggle title, and progress description/status.
Title and Wizard text wrapping
Title/title.scss, Wizard/wizard.scss		 Changes overflow-wrap from break-word/any to anywhere for title, wizard toggle-list-item, nav-link, and main content area.

Estimated code review effort: 1 (Trivial) | ~5 minutes

Possibly related PRs

  • patternfly/patternfly#8438: Original migration that introduced the overflow-wrap: break-word value this PR corrects to anywhere for the same selectors.

Suggested reviewers: jcmill

🚥 Pre-merge checks | ✅ 4
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title uses a valid conventional commit prefix and matches the wrapping bug fix.
Linked Issues check ✅ Passed The PR updates the affected overflow-wrap rules to anywhere as required by issue #8484.
Out of Scope Changes check ✅ Passed The changes stay within text-wrapping CSS updates and do not introduce unrelated scope.

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

Comment @coderabbitai help to get the list of available commands.

@patternfly-build

patternfly-build commented Jul 8, 2026 •
edited
Loading

Copy link
Copy Markdown
Collaborator

Preview: https://pf-pr-8487.surge.sh

A11y report: https://pf-pr-8487-a11y.surge.sh

jcmill
jcmill approved these changes Jul 8, 2026
View reviewed changes

@jcmill jcmill left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

✈️

@mcoker
mcoker merged commit 3800acf into patternfly:main Jul 8, 2026
6 checks passed
@mcoker
mcoker deleted the issue-8484 branch July 8, 2026 19:44
@patternfly-build

patternfly-build commented Jul 8, 2026

Copy link
Copy Markdown
Collaborator

🎉 This PR is included in version 6.6.0-prerelease.17 🎉

The release is available on:

Your semantic-release bot 📦🚀

@coderabbitai coderabbitai Bot mentioned this pull request Jul 8, 2026
Closed
3 tasks
This was referenced Jul 21, 2026
Merged
Closed
@dlabaj dlabaj mentioned this pull request Jul 28, 2026
Merged
dlabaj pushed a commit that referenced this pull request Jul 28, 2026
@mcoker @dlabaj
fix: address word-break/overflow-wrap bug (#8487)
04fec5e
dlabaj added a commit that referenced this pull request Jul 28, 2026
@dlabaj @mcoker
@andrew-ronaldson @jcmill @thatblindgeye
fix: cherry-pick main fixes into 6.6.x (#8531)
60468ef 
* fix: address word-break/overflow-wrap bug (#8487)

* chore(input group): add radius modifier (#8483)

* fix(table): nested table sorting (#8491)

* fix(tree-view): revert caret rotations (#8490)

* fix(a11y): ignore target-size rule for WCAG 2.2 bump (#8493)

* fix(tree): update tree table and DLS tree toggle icon direction (#8502)

* fix: update disabled description to use text color token (#8497)

* fix(plain actions): update tokens to vertical-plain (#8495)

* fix: address bottom pagination bugs (#8498)

* fix: address bottom pagination bugs

* fix: round border-radius on default bottom in glass

* chore(primary details): fix drawer and toolbar (#8509)

* fix(modal): footer action spacing (#8526)

---------

Co-authored-by: Michael Coker <35148959+mcoker@users.noreply.github.com>
Co-authored-by: Andrew Ronaldson <aronalds@redhat.com>
Co-authored-by: Jake Miller <jake83miller@gmail.com>
Co-authored-by: Eric Olkowski <70952936+thatblindgeye@users.noreply.github.com>
Co-authored-by: Jake Miller <jakmille@redhat.com>
@jelly jelly mentioned this pull request Aug 3, 2026
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@jcmill jcmill jcmill approved these changes

Assignees

No one assigned

Labels

released on @prerelease

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Bug - Modal - overflow-wrap migration from word-break was applied wrong

3 participants

@mcoker @patternfly-build @jcmill