Fix whitespace rendering in diff (#13415)

- Introduce new .code-inner class that sets the CSS attributes on
rendered code lines like view,blame and diff.
- Rename .wrap class to .word-break to reflect what it actually does
- Remove .raw which was only used on webhook page
- Set white-space: pre-wrap except on blame where it can break the
layout

Fixes: https://github.com/go-gitea/gitea/issues/13406
This commit is contained in:
silverwind 2020-11-04 08:14:07 +01:00 committed by GitHub
parent 951a333733
commit 62719cdd2d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
12 changed files with 45 additions and 58 deletions

View file

@ -177,42 +177,6 @@ a:hover,
color: var(--color-primary-dark-2);
}
.rounded {
border-radius: var(--border-radius) !important;
}
.wrap {
word-wrap: break-word;
word-break: break-all;
}
.mono {
font-family: var(--fonts-monospace);
}
pre,
code {
font: 12px var(--fonts-monospace);
&.raw {
padding: 7px 12px;
margin: 10px 0;
background-color: #f8f8f8;
border: 1px solid #dddddd;
border-radius: 3px;
font-size: 13px;
line-height: 1.5;
overflow: auto;
}
&.wrap {
white-space: pre-wrap;
word-break: break-all;
overflow-wrap: break-word;
word-wrap: break-word;
}
}
.dont-break-out {
overflow-wrap: break-word;
word-wrap: break-word;
@ -1137,10 +1101,6 @@ i.icon.centerlock {
padding-left: 5px;
}
.lines-code code {
white-space: pre;
}
.lines-code.active,
.lines-code .active {
background: #fffbdd !important;
@ -1155,6 +1115,18 @@ i.icon.centerlock {
padding: 0 !important;
}
.code-inner {
font: 12px var(--fonts-monospace);
white-space: pre-wrap;
word-break: break-all;
overflow-wrap: break-word;
word-wrap: break-word;
}
.blame .code-inner {
white-space: pre;
}
.lines-commit {
vertical-align: top;
color: #999999;

View file

@ -3239,6 +3239,17 @@ td.blob-excerpt {
padding-left: 8px;
}
.webhook-info {
padding: 7px 12px;
margin: 10px 0;
background-color: #f8f8f8;
border: 1px solid #dddddd;
border-radius: 3px;
font-size: 13px;
line-height: 1.5;
overflow: auto;
}
.title_wip_desc {
margin-top: 1em;
}

View file

@ -4,6 +4,9 @@
.js { justify-content: flex-start; }
.je { justify-content: flex-end; }
.sb { justify-content: space-between; }
.mono { font-family: var(--fonts-monospace); }
.rounded { border-radius: var(--border-radius) !important; }
.word-break { word-wrap: break-word; word-break: break-all; }
.m-0 { margin: 0 !important; }
.m-1 { margin: .125rem !important; }