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

Fix broken folder variant Tile layout when name is long #2378

Merged
merged 3 commits into from
Dec 18, 2024
Merged

Fix broken folder variant Tile layout when name is long #2378

merged 3 commits into from
Dec 18, 2024

Conversation

r100-stack
Copy link
Member

@r100-stack r100-stack commented Dec 18, 2024 •
edited
Loading

Changes

Fixes #2376

Adds min-inline-size: 0 to .iui-tile-name to prevent the Tile folder variant UI from breaking when there's a long name label.

Testing

  • CI still passing
  • Tested some cases similar to the user's sandbox in a separate sandbox.
Before After
image image

Docs

Added changesets

@r100-stack r100-stack self-assigned this Dec 18, 2024
@r100-stack r100-stack marked this pull request as ready for review December 18, 2024 17:45
@r100-stack r100-stack requested a review from a team as a code owner December 18, 2024 17:45
@r100-stack r100-stack requested review from mayank99 and smmr-dn and removed request for a team December 18, 2024 17:45
mayank99
mayank99 approved these changes Dec 18, 2024
View reviewed changes
Copy link
Contributor

@mayank99 mayank99 left a comment

Choose a reason for hiding this comment

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

Lets make a patch release right after merging this.

@r100-stack r100-stack changed the title Fix broken folder variant Tile layout when long name Fix broken folder variant Tile layout when name is long Dec 18, 2024
@r100-stack r100-stack enabled auto-merge (squash) December 18, 2024 19:15
@r100-stack r100-stack merged commit 88b9432 into main Dec 18, 2024
18 checks passed
@r100-stack r100-stack deleted the r/tile-folder-overflow-fix branch December 18, 2024 19:44
@imodeljs-admin imodeljs-admin mentioned this pull request Dec 18, 2024
Merged
@HaveSpacesuit
Copy link
Contributor

I have noticed something similar on regular tiles with long names - do you think this will affect those as well?

@r100-stack
Copy link
Member Author

r100-stack commented Dec 19, 2024 •
edited
Loading

I have noticed something similar on regular tiles with long names - do you think this will affect those as well?

Actually, I don't think there was any problem with regular tiles with large names before this PR. (sandbox). After this PR, it continues to work. Feel free to let me know if I misunderstood your question.

@HaveSpacesuit
Copy link
Contributor

Here is an example. If the name does not contain spaces, it breaks out of the tile. We work around this by using MiddleTextTruncation, though I'm not sure that is explicitly supported for use by package consumers.

https://stackblitz.com/edit/github-h7qvdgke?file=src%2FApp.tsx

image

@mayank99
Copy link
Contributor

mayank99 commented Dec 20, 2024 •
edited
Loading

@HaveSpacesuit This is definitely something we should fix. Could you please open a new issue? This PR is not the best place for this discussion.

Edit: Cross-linking #2383

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

@mayank99 mayank99 mayank99 approved these changes

@smmr-dn smmr-dn smmr-dn approved these changes

Assignees

@r100-stack r100-stack

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Tile with variant="folder" does not truncate name
4 participants
@r100-stack @HaveSpacesuit @mayank99 @smmr-dn