Skip to content

fix(textInputGroup): fix overlapping status icon and utility button - #7588

Merged
mcoker merged 1 commit into
patternfly:mainfrom
srambach:7462-text-input-group-icon-overlap
Aug 8, 2025
Merged

mcoker merged 1 commit into
patternfly:mainfrom
srambach:7462-text-input-group-icon-overlap

Conversation

@srambach

@srambach srambach commented Jul 1, 2025

Copy link
Copy Markdown
Member

When the icon prop was not set on a text input group, the status icon (error, warning, success) could overlap with the close button due to missing layout adjustments.

What’s changed?
The SCSS now sets --#{$text-input-group}__text--Position: relative; whenever a status modifier is present, ensuring the status icon is always spaced correctly from the close button, even if there’s no leading icon.

A new example has been added in text input group.

Closes #7462

@patternfly-build

patternfly-build commented Jul 1, 2025 •

Copy link
Copy Markdown
Collaborator

@srambach
srambach requested review from mcoker and thatblindgeye July 2, 2025 15:27

@mcoker mcoker 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 5ce9b1b into patternfly:main Aug 8, 2025
@patternfly-build

Copy link
Copy Markdown
Collaborator

🎉 This PR is included in version 6.3.0-prerelease.48 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Bug - Text Input Group - status icon can overlay close button if a icon prop is not included

4 participants