Skip to content

Fix Pull Request comment filename word breaks #19535

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
Merged
merged 7 commits into from
Apr 29, 2022
Merged

Fix Pull Request comment filename word breaks #19535

merged 7 commits into from
Apr 29, 2022

Conversation

parnic
Copy link
Contributor

@parnic parnic commented Apr 27, 2022 •
edited
Loading

This fixes word wrapping on the filename for a comment on a PR. A previous commit fixed this problem in Firefox, but not Chrome.

It also fixes the Outdated badge wrapping mid-word in the same situation. (#16248 (comment))

Fixes #16248

parnic added 2 commits April 27, 2022 11:22
@parnic
Fix word breaks in Chrome
6707481 
This fixes word wrapping on the filename for a comment on a PR. A previous commit fixed this problem in Firefox, but not Chrome.

Fixes go-gitea#16248
@parnic
Don't break Outdated badge
5fa1750 
This prevents the Outdated badge on a PR from wrapping in the middle of the word for a comment on a long filename.
@parnic parnic changed the title Fix word breaks in Chrome Fix Pull Request comment filename word breaks in Chrome Apr 27, 2022
@6543 6543 added the topic/ui Change the appearance of the Gitea UI label Apr 28, 2022
@6543 6543 added this to the 1.17.0 milestone Apr 28, 2022
@GiteaBot GiteaBot added the lgtm/need 1 This PR needs approval from one additional maintainer to be merged. label Apr 28, 2022
@wxiaoguang
Copy link
Contributor

Even for Firefox, the bug still has existed, so I believe the old fix was incorrect.

I have a feeling that we should remove all the word-break-* classes, and just add a word-break-all to <a href="{{(index $comms 0).CodeCommentURL}}" class="file-comment ml-3">{{$filename}}</a>

I have tested it on https://try.gitea.io/wxiaoguang/test/pulls/9

Before

image

Remove all word-break and just add one to <a>

image

@parnic
Copy link
Contributor Author

parnic commented Apr 28, 2022

@wxiaoguang I pushed a similar change to what you're recommending. It does work when applied to https://try.gitea.io/parnic-sks/long-paths-test-2/pulls/1, but if you'd prefer it be break-all instead of break-word, I can do that.

@parnic parnic changed the title Fix Pull Request comment filename word breaks in Chrome Fix Pull Request comment filename word breaks Apr 28, 2022
@silverwind
Copy link
Member

FYI, word-break: break-word is deprecated as per MDN. I don't know the intrinsic details, but I think overflow-wrap is supposed to replace it.

@parnic
Copy link
Contributor Author

parnic commented Apr 28, 2022

FYI, word-break: break-word is deprecated as per MDN. I don't know the intrinsic details, but I think overflow-wrap is supposed to replace it.

After testing, it looks like overflow-wrap: anywhere behaves the same. I've added that to the class used here.

silverwind
silverwind reviewed Apr 28, 2022
View reviewed changes
@wxiaoguang
Copy link
Contributor

@wxiaoguang I pushed a similar change to what you're recommending. It does work when applied to https://try.gitea.io/parnic-sks/long-paths-test-2/pulls/1, but if you'd prefer it be break-all instead of break-word, I can do that.

I am fine with either, since they all work and are easy to be changed in future.

@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 Apr 28, 2022
@lafriks lafriks merged commit 3e2bba0 into go-gitea:main Apr 29, 2022
@parnic parnic deleted the fix-16248-word-breaks-in-chrome branch April 29, 2022 11:30
Gusted pushed a commit to Gusted/gitea that referenced this pull request Apr 30, 2022
@parnic @silverwind
@6543 @lunny
Fix Pull Request comment filename word breaks (go-gitea#19535)
7834260 
* Fix word breaks in Chrome

This fixes word wrapping on the filename for a comment on a PR. A previous commit fixed this problem in Firefox, but not Chrome.

Fixes go-gitea#16248

* Don't break Outdated badge

This prevents the Outdated badge on a PR from wrapping in the middle of the word for a comment on a long filename.

* Move word break to recommended element

* Add overflow-wrap per PR review

* Update web_src/less/helpers.less

Co-authored-by: silverwind <[email protected]>
Co-authored-by: 6543 <[email protected]>
Co-authored-by: Lunny Xiao <[email protected]>
zjjhot added a commit to zjjhot/gitea that referenced this pull request May 1, 2022
@zjjhot
Merge remote-tracking branch 'giteaofficial/main'
6f9a52f 
* giteaofficial/main:
  Avoid MoreThanOne Error (go-gitea#19557)
  [skip ci] Updated licenses and gitignores
  Simplify loops to copy (go-gitea#19569)
  Use middleware to open gitRepo (go-gitea#19559)
  Added X-Mailer header to outgoing emails (go-gitea#19562)
  fix go-gitea#19545 (go-gitea#19563)
  [skip ci] Updated translations via Crowdin
  Respect DefaultUserIsRestricted system default when creating new user (go-gitea#19310)
  Mute link in diff header (go-gitea#19556)
  Add API to query collaborators permission for a repository (go-gitea#18761)
  Permalink files In PR diff (go-gitea#19534)
  Fix Pull Request comment filename word breaks (go-gitea#19535)
  Don't error when branch's commit doesn't exist (go-gitea#19547)
parnic-sks pushed a commit to parnic-sks/gitea that referenced this pull request May 16, 2022
@parnic @silverwind
@6543 @lunny @parnic-sks
Fix Pull Request comment filename word breaks (go-gitea#19535)
d299d8f 
* Fix word breaks in Chrome

This fixes word wrapping on the filename for a comment on a PR. A previous commit fixed this problem in Firefox, but not Chrome.

Fixes go-gitea#16248

* Don't break Outdated badge

This prevents the Outdated badge on a PR from wrapping in the middle of the word for a comment on a long filename.

* Move word break to recommended element

* Add overflow-wrap per PR review

* Update web_src/less/helpers.less

Co-authored-by: silverwind <[email protected]>
Co-authored-by: 6543 <[email protected]>
Co-authored-by: Lunny Xiao <[email protected]>
AbdulrhmnGhanem pushed a commit to kitspace/gitea that referenced this pull request Aug 24, 2022
@parnic @silverwind
@6543 @lunny @AbdulrhmnGhanem
Fix Pull Request comment filename word breaks (go-gitea#19535)
e4e84fa 
* Fix word breaks in Chrome

This fixes word wrapping on the filename for a comment on a PR. A previous commit fixed this problem in Firefox, but not Chrome.

Fixes go-gitea#16248

* Don't break Outdated badge

This prevents the Outdated badge on a PR from wrapping in the middle of the word for a comment on a long filename.

* Move word break to recommended element

* Add overflow-wrap per PR review

* Update web_src/less/helpers.less

Co-authored-by: silverwind <[email protected]>
Co-authored-by: 6543 <[email protected]>
Co-authored-by: Lunny Xiao <[email protected]>
@go-gitea go-gitea locked and limited conversation to collaborators May 3, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@silverwind silverwind silverwind left review comments

@lafriks lafriks lafriks approved these changes

@wxiaoguang wxiaoguang wxiaoguang approved these changes

@6543 6543 6543 approved these changes

Assignees
No one assigned
Labels
lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. topic/ui Change the appearance of the Gitea UI
Projects
None yet
Milestone
1.17.0
Development

Successfully merging this pull request may close these issues.

Incorrect wrapping on PR comments with long paths
7 participants
@parnic @wxiaoguang @silverwind @lafriks @6543 @GiteaBot @lunny