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

"This commit is contained in" overflows the box #29016

Closed
colejohnson66 opened this issue Feb 1, 2024 · 6 comments · Fixed by #29021
Closed

"This commit is contained in" overflows the box #29016

colejohnson66 opened this issue Feb 1, 2024 · 6 comments · Fixed by #29021
Labels
topic/ui Change the appearance of the Gitea UI type/bug

Comments

@colejohnson66
Copy link

colejohnson66 commented Feb 1, 2024

Description

As shown in the screenshot below, the "this commit is contained in" list overflows the summary box.

Gitea Version

1.21.4

Can you reproduce the bug on the Gitea demo site?

Untested

Log Gist

No response

Screenshots

image
image

Git Version

No response

Operating System

No response

How are you running Gitea?

Service on Windows Server

Database

MySQL/MariaDB

@silverwind
Copy link
Member

Maybe we should try a overflow-wrap: anywhere global CSS rule to fix these issues once and for all, but may have side-effects on elements that do not expect their content to wrap.

@colejohnson66
Copy link
Author

colejohnson66 commented Feb 1, 2024

It's in a flexbox, so adding overflow-warp:anywhere to the div.tag-area element does this:

image

I don't know about you, but, to me, that's worse. Maybe replacing the list with an inline ul would be a better option.

@silverwind
Copy link
Member

Right, in this case the correct solution will be flex-wrap: wrap on the parent node.

And sadly, it already highlights why we can't have global overflow-wrap: anywhere.

@techknowlogick techknowlogick added the topic/ui Change the appearance of the Gitea UI label Feb 1, 2024
@colejohnson66
Copy link
Author

flex-wrap: wrap does indeed fix the issue:

image

@delvh
Copy link
Member

delvh commented Feb 1, 2024

The funny thing is: I originally designed the box so that it should already do that (compare with the screenshot in #25180).
I thought I designed it resilient enough not to have this type of problem, but apparently something else must have changed in the meantime…

delvh added a commit to delvh/gitea that referenced this issue Feb 1, 2024
Copy link

Automatically locked because of our CONTRIBUTING guidelines

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Feb 28, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
topic/ui Change the appearance of the Gitea UI type/bug
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants