Skip to content

Commit

Permalink
[Filters] add wrapping behaviour when strings with no spacing overflow (
Browse files Browse the repository at this point in the history
#10012)

Fixes #10011

This pull requests add the `word-break` css property at the same level
the popover wrapper's minimum and maximum width is set in order to allow
for string without spaces to wrap the same way strings with spaces do.

## Before
![Screenshot 2023-08-10 at 4 04 58
PM](https://github.com/Shopify/polaris/assets/27571390/8ac14d73-a957-4bd3-8827-bf4c04120124)

## After
![Screenshot 2023-08-10 at 4 04 05
PM](https://github.com/Shopify/polaris/assets/27571390/0fca6cd4-36c5-4725-960b-109dc0fcd705)

---------

Co-authored-by: Jess Telford <jess+github@jes.st>
  • Loading branch information
melvinadu and jesstelford authored Aug 14, 2023
1 parent 77539b1 commit 3ae94ce
Show file tree
Hide file tree
Showing 2 changed files with 6 additions and 0 deletions.
5 changes: 5 additions & 0 deletions .changeset/empty-walls-design.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@shopify/polaris': patch
---

Fixed wrapping overflow of strings with no spacing within `Filters` popover
Original file line number Diff line number Diff line change
Expand Up @@ -157,6 +157,7 @@
.PopoverWrapper {
min-width: 185px;
max-width: 300px;
word-break: break-word;
}

.ClearButtonWrapper {
Expand Down

0 comments on commit 3ae94ce

Please sign in to comment.