Prevent Commit Status and Message From Overflowing On Branch Page (#7800) (#7808)

Signed-off-by: Gary Kim <gary@garykim.dev>
This commit is contained in:
Gary Kim 2019-08-09 18:40:16 +00:00 committed by Lauris BH
parent 38e799779f
commit 9b95b41aa8
3 changed files with 19 additions and 12 deletions

View file

@ -623,6 +623,7 @@ footer .ui.left,footer .ui.right{line-height:40px}
.repository #commits-table thead .sha{width:140px} .repository #commits-table thead .sha{width:140px}
.repository #commits-table thead .shatd{text-align:center} .repository #commits-table thead .shatd{text-align:center}
.repository #commits-table td.sha .sha.label{margin:0} .repository #commits-table td.sha .sha.label{margin:0}
.repository #commits-table td.message{text-overflow:unset}
.repository #commits-table.ui.basic.striped.table tbody tr:nth-child(2n){background-color:rgba(0,0,0,.02)!important} .repository #commits-table.ui.basic.striped.table tbody tr:nth-child(2n){background-color:rgba(0,0,0,.02)!important}
.repository #commits-table td.sha .sha.label.isSigned,.repository #repo-files-table .sha.label.isSigned{border:1px solid #bbb} .repository #commits-table td.sha .sha.label.isSigned,.repository #repo-files-table .sha.label.isSigned{border:1px solid #bbb}
.repository #commits-table td.sha .sha.label.isSigned .detail.icon,.repository #repo-files-table .sha.label.isSigned .detail.icon{background:#fafafa;margin:-6px -10px -4px 0;padding:5px 3px 5px 6px;border-left:1px solid #bbb;border-top-left-radius:0;border-bottom-left-radius:0} .repository #commits-table td.sha .sha.label.isSigned .detail.icon,.repository #repo-files-table .sha.label.isSigned .detail.icon{background:#fafafa;margin:-6px -10px -4px 0;padding:5px 3px 5px 6px;border-left:1px solid #bbb;border-top-left-radius:0;border-bottom-left-radius:0}
@ -817,8 +818,8 @@ footer .ui.left,footer .ui.right{line-height:40px}
.stats-table .table-cell{display:table-cell} .stats-table .table-cell{display:table-cell}
.stats-table .table-cell.tiny{height:.5em} .stats-table .table-cell.tiny{height:.5em}
tbody.commit-list{vertical-align:baseline} tbody.commit-list{vertical-align:baseline}
.commit-list .message-wrapper{overflow:hidden;text-overflow:ellipsis;max-width:calc(100% - 24px);display:inline-block;vertical-align:middle} .commit-list .message-wrapper{overflow:hidden;text-overflow:ellipsis;max-width:calc(100% - 50px);display:inline-block;vertical-align:middle}
.commit-list .message-wrapper .commit-status-link{display:inline-block;vertical-align:middle} .commit-list .commit-status-link{display:inline-block;vertical-align:middle}
.commit-body{white-space:pre-wrap} .commit-body{white-space:pre-wrap}
.git-notes.top{text-align:left} .git-notes.top{text-align:left}
.git-notes .commit-body{margin:0} .git-notes .commit-body{margin:0}

View file

@ -1265,6 +1265,10 @@
margin: 0; margin: 0;
} }
td.message {
text-overflow: unset;
}
&.ui.basic.striped.table tbody tr:nth-child(2n) { &.ui.basic.striped.table tbody tr:nth-child(2n) {
background-color: rgba(0, 0, 0, 0.02) !important; background-color: rgba(0, 0, 0, 0.02) !important;
} }
@ -2302,12 +2306,12 @@ tbody.commit-list {
.commit-list .message-wrapper { .commit-list .message-wrapper {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
max-width: calc(100% - 24px); max-width: calc(100% - 50px);
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
} }
.commit-list .message-wrapper .commit-status-link { .commit-list .commit-status-link {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
} }

View file

@ -72,12 +72,14 @@
<td class="message"> <td class="message">
<span class="message-wrapper"> <span class="message-wrapper">
<span class="commit-summary has-emoji{{if gt .ParentCount 1}} grey text{{end}}" title="{{.Summary}}">{{.Summary}}</span> <span class="commit-summary has-emoji{{if gt .ParentCount 1}} grey text{{end}}" title="{{.Summary}}">{{.Summary}}</span>
</span>
{{if IsMultilineCommitMessage .Message}} {{if IsMultilineCommitMessage .Message}}
<button class="basic compact mini ui icon button commit-button"><i class="ellipsis horizontal icon"></i></button> <button class="basic compact mini ui icon button commit-button"><i class="ellipsis horizontal icon"></i></button>
{{end}}
{{template "repo/commit_status" .Status}}
{{if IsMultilineCommitMessage .Message}}
<pre class="commit-body" style="display: none;">{{RenderCommitBody .Message $.RepoLink $.Repository.ComposeMetas}}</pre> <pre class="commit-body" style="display: none;">{{RenderCommitBody .Message $.RepoLink $.Repository.ComposeMetas}}</pre>
{{end}} {{end}}
</span>
{{template "repo/commit_status" .Status}}
</td> </td>
<td class="grey text right aligned">{{TimeSince .Author.When $.Lang}}</td> <td class="grey text right aligned">{{TimeSince .Author.When $.Lang}}</td>
</tr> </tr>