Fix Pull Request comment filename word breaks (#19535)
* 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 #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 <me@silverwind.io> Co-authored-by: 6543 <6543@obermui.de> Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
This commit is contained in:
parent
334707fee9
commit
3e2bba0803
|
@ -505,13 +505,13 @@
|
||||||
{{ range $filename, $lines := .Review.CodeComments}}
|
{{ range $filename, $lines := .Review.CodeComments}}
|
||||||
{{range $line, $comms := $lines}}
|
{{range $line, $comms := $lines}}
|
||||||
<div class="ui segments">
|
<div class="ui segments">
|
||||||
<div class="ui segment py-3 df ac sb word-break">
|
<div class="ui segment py-3 df ac sb">
|
||||||
{{$invalid := (index $comms 0).Invalidated}}
|
{{$invalid := (index $comms 0).Invalidated}}
|
||||||
{{$resolved := (index $comms 0).IsResolved}}
|
{{$resolved := (index $comms 0).IsResolved}}
|
||||||
{{$resolveDoer := (index $comms 0).ResolveDoer}}
|
{{$resolveDoer := (index $comms 0).ResolveDoer}}
|
||||||
{{$isNotPending := (not (eq (index $comms 0).Review.Type 0))}}
|
{{$isNotPending := (not (eq (index $comms 0).Review.Type 0))}}
|
||||||
<div class="df ac">
|
<div class="df ac">
|
||||||
<a href="{{(index $comms 0).CodeCommentURL}}" class="file-comment ml-3">{{$filename}}</a>
|
<a href="{{(index $comms 0).CodeCommentURL}}" class="file-comment ml-3 word-break">{{$filename}}</a>
|
||||||
{{if $invalid }}
|
{{if $invalid }}
|
||||||
<span class="ui label basic small ml-3">
|
<span class="ui label basic small ml-3">
|
||||||
{{$.i18n.Tr "repo.issues.review.outdated"}}
|
{{$.i18n.Tr "repo.issues.review.outdated"}}
|
||||||
|
|
|
@ -27,6 +27,8 @@
|
||||||
|
|
||||||
.word-break {
|
.word-break {
|
||||||
word-wrap: break-word !important;
|
word-wrap: break-word !important;
|
||||||
|
word-break: break-word; /* compat: Safari */
|
||||||
|
overflow-wrap: anywhere;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ellipsis {
|
.ellipsis {
|
||||||
|
|
Loading…
Reference in a new issue