Wrapping was initially added in https://github.com/go-gitea/gitea/pull/2789 but it is currently disabled because the rule that applies wrapping to the wrap class did not have enough CSS specificity. Resolved the issue by using a general selector that matches all code boxes. The previous wrap class was removed because it had only been inconsistenly applied to various code boxes and because I found no easy way to add classes to code boxes rendered in Markdown. Also removed a seemingly useless :before on code view and added padding to restore the spacing.pull/5927/head
line-height: 1.5; | line-height: 1.5; | ||||
overflow: auto; | overflow: auto; | ||||
} | } | ||||
&.wrap { | |||||
white-space: pre-wrap; /* CSS 3 */ | |||||
// white-space: -moz-normal; /* Mozilla, since 1999 */ | |||||
// white-space: -normal; /* Opera 4-6 */ | |||||
// white-space: -o-normal; /* Opera 7 */ | |||||
-ms-word-break: break-all; | |||||
word-break: break-all; | |||||
/* These are technically the same, but use both */ | |||||
overflow-wrap: break-word; | |||||
word-wrap: break-word; | |||||
} | |||||
} | |||||
/* Wrap long lines of code. This will also apply to Markdown code boxes. */ | |||||
pre > code { | |||||
white-space: pre-wrap !important; | |||||
word-break: break-all !important; | |||||
overflow-wrap: break-word !important; | |||||
} | } | ||||
.dont-break-out { | .dont-break-out { | ||||
/* These are technically the same, but use both */ | |||||
overflow-wrap: break-word; | overflow-wrap: break-word; | ||||
word-wrap: break-word; | |||||
-ms-word-break: break-all; | |||||
word-break: break-all; | word-break: break-all; | ||||
/* Adds a hyphen where the word breaks, if supported (No Blink) */ | /* Adds a hyphen where the word breaks, if supported (No Blink) */ |
padding: 0 !important; | padding: 0 !important; | ||||
li { | li { | ||||
display: block; | display: block; | ||||
width: 100%; | |||||
padding: 0 .25em; | |||||
&.active { | &.active { | ||||
background: #ffffdd; | background: #ffffdd; | ||||
} | } | ||||
&:before { | |||||
content: ' '; | |||||
} | |||||
} | } | ||||
} | } | ||||
} | } |
{{if and $.SignedUserID $line.CanComment $.PageIsPullFiles (not (eq .GetType 2))}} | {{if and $.SignedUserID $line.CanComment $.PageIsPullFiles (not (eq .GetType 2))}} | ||||
<a class="ui green button add-code-comment add-code-comment-left" data-path="{{$file.Name}}" data-side="left" data-idx="{{$line.LeftIdx}}">+</a> | <a class="ui green button add-code-comment add-code-comment-left" data-path="{{$file.Name}}" data-side="left" data-idx="{{$line.LeftIdx}}">+</a> | ||||
{{end}} | {{end}} | ||||
<pre><code class="wrap {{if $highlightClass}}language-{{$highlightClass}}{{else}}nohighlight{{end}}">{{if $line.LeftIdx}}{{$section.GetComputedInlineDiffFor $line}}{{end}}</code></pre> | |||||
<pre><code class="{{if $highlightClass}}language-{{$highlightClass}}{{else}}nohighlight{{end}}">{{if $line.LeftIdx}}{{$section.GetComputedInlineDiffFor $line}}{{end}}</code></pre> | |||||
</td> | </td> | ||||
<td class="lines-num lines-num-new"> | <td class="lines-num lines-num-new"> | ||||
<span rel="{{if $line.RightIdx}}diff-{{Sha1 $file.Name}}R{{$line.RightIdx}}{{end}}">{{if $line.RightIdx}}{{$line.RightIdx}}{{end}}</span> | <span rel="{{if $line.RightIdx}}diff-{{Sha1 $file.Name}}R{{$line.RightIdx}}{{end}}">{{if $line.RightIdx}}{{$line.RightIdx}}{{end}}</span> | ||||
{{if and $.SignedUserID $line.CanComment $.PageIsPullFiles (not (eq .GetType 3))}} | {{if and $.SignedUserID $line.CanComment $.PageIsPullFiles (not (eq .GetType 3))}} | ||||
<a class="ui green button add-code-comment add-code-comment-right" data-path="{{$file.Name}}" data-side="right" data-idx="{{$line.RightIdx}}">+</a> | <a class="ui green button add-code-comment add-code-comment-right" data-path="{{$file.Name}}" data-side="right" data-idx="{{$line.RightIdx}}">+</a> | ||||
{{end}} | {{end}} | ||||
<pre><code class="wrap {{if $highlightClass}}language-{{$highlightClass}}{{else}}nohighlight{{end}}">{{if $line.RightIdx}}{{$section.GetComputedInlineDiffFor $line}}{{end}}</code></pre> | |||||
<pre><code class="{{if $highlightClass}}language-{{$highlightClass}}{{else}}nohighlight{{end}}">{{if $line.RightIdx}}{{$section.GetComputedInlineDiffFor $line}}{{end}}</code></pre> | |||||
</td> | </td> | ||||
</tr> | </tr> | ||||
{{if gt (len $line.Comments) 0}} | {{if gt (len $line.Comments) 0}} |
{{if and $.root.SignedUserID $line.CanComment $.root.PageIsPullFiles}} | {{if and $.root.SignedUserID $line.CanComment $.root.PageIsPullFiles}} | ||||
<a class="ui green button add-code-comment add-code-comment-{{if $line.RightIdx}}right{{else}}left{{end}}" data-path="{{$file.Name}}" data-side="{{if $line.RightIdx}}right{{else}}left{{end}}" data-idx="{{if $line.RightIdx}}{{$line.RightIdx}}{{else}}{{$line.LeftIdx}}{{end}}">+</a> | <a class="ui green button add-code-comment add-code-comment-{{if $line.RightIdx}}right{{else}}left{{end}}" data-path="{{$file.Name}}" data-side="{{if $line.RightIdx}}right{{else}}left{{end}}" data-idx="{{if $line.RightIdx}}{{$line.RightIdx}}{{else}}{{$line.LeftIdx}}{{end}}">+</a> | ||||
{{end}} | {{end}} | ||||
<pre><code class="wrap {{if $highlightClass}}language-{{$highlightClass}}{{else}}nohighlight{{end}}">{{$section.GetComputedInlineDiffFor $line}}</code></pre> | |||||
<pre><code class="{{if $highlightClass}}language-{{$highlightClass}}{{else}}nohighlight{{end}}">{{$section.GetComputedInlineDiffFor $line}}</code></pre> | |||||
</td> | </td> | ||||
</tr> | </tr> | ||||
{{if gt (len $line.Comments) 0}} | {{if gt (len $line.Comments) 0}} |