Skip to content

fix(ui): prevent commit status popup overflowing its row#38081

Merged
bircni merged 5 commits into
go-gitea:mainfrom
bircni:fix/commit-status-popup-overlap
Jun 13, 2026
Merged

fix(ui): prevent commit status popup overflowing its row#38081
bircni merged 5 commits into
go-gitea:mainfrom
bircni:fix/commit-status-popup-overlap

Conversation

@bircni

@bircni bircni commented Jun 11, 2026

Copy link
Copy Markdown
Member

Fixes #38079

Regression path

The layout previously had .commit-status-item .status-context { flex: 1 },
which let the context fill remaining space and ellipsize. That rule was
dropped in #37517 ("Refactor pull request view (5)") when the row markup
moved to nested .flex-text-block wrappers, so nothing constrained the
left block anymore.

After:
image

The commit-status popup lays out each row as a flex container with a left
block (icon + status context) and a right block ("Details" link). The
pull-request view refactor dropped the old `.status-context { flex: 1 }`
rule, so the left block expanded to full width and pushed the "Details"
link onto a new line. Combined with the fixed 40px row height, the wrapped
line overflowed and overlapped the file header above it.

Let the left block fill the remaining space with `flex: 1; min-width: 0`
and add `min-width: 0` to `.status-context` so its existing gt-ellipsis
truncation works, keeping "Details" on the same row.

Assisted-by: Claude:claude-opus-4-8
@bircni bircni requested review from lunny and wxiaoguang June 11, 2026 18:06
@GiteaBot GiteaBot added the lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. label Jun 11, 2026
@bircni bircni marked this pull request as ready for review June 11, 2026 18:06
@GiteaBot GiteaBot added lgtm/need 1 This PR needs approval from one additional maintainer to be merged. and removed lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. labels Jun 11, 2026
Comment thread web_src/css/repo.css Outdated
flex-wrap: wrap;
}

.commit-status-item > .flex-text-block:first-child {

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.

Please avoid such fragile style. You won't be able to know what is .flex-text-block:first-child

@wxiaoguang wxiaoguang 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.

If it looks good to you, feel free to merge.

@GiteaBot GiteaBot added lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. and removed lgtm/need 1 This PR needs approval from one additional maintainer to be merged. labels Jun 13, 2026
@bircni bircni added the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label Jun 13, 2026
@bircni bircni enabled auto-merge (squash) June 13, 2026 09:57
@bircni bircni merged commit aab9737 into go-gitea:main Jun 13, 2026
24 checks passed
@GiteaBot GiteaBot added this to the 1.28.0 milestone Jun 13, 2026
@GiteaBot GiteaBot removed the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label Jun 13, 2026
@lunny lunny modified the milestones: 1.28.0, 1.27.0 Jun 13, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. type/bug

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Bug: Workflow status tooltip is misaligned and partially overlaps the file header

4 participants