From e43d1c586c5bb7c116eb5c27c6417fde4bf7188a Mon Sep 17 00:00:00 2001 From: Gary Kim Date: Fri, 9 Aug 2019 01:43:40 +0800 Subject: [PATCH 1/3] Prevent Commit Status From Overflowing On Branch Page It is possible for the commit ci status on the branches page for a repository to become an ellipsis due to overflowing. This commit will fix that issue by using flex. Signed-off-by: Gary Kim --- public/css/index.css | 1 + public/less/_repository.less | 6 ++++++ 2 files changed, 7 insertions(+) diff --git a/public/css/index.css b/public/css/index.css index b38d814ea5953..d2104ecc1e201 100644 --- a/public/css/index.css +++ b/public/css/index.css @@ -632,6 +632,7 @@ footer .ui.left,footer .ui.right{line-height:40px} .repository #commits-table thead .sha{width:140px} .repository #commits-table thead .shatd{text-align:center} .repository #commits-table td.sha .sha.label{margin:0} +.repository #commits-table td.message{display:flex;padding-top:0;padding-bottom:0} .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,.repository #repo-files-table .sha.label{border:1px solid #bbb} .repository #commits-table td.sha .sha.label .detail.icon,.repository #repo-files-table .sha.label .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} diff --git a/public/less/_repository.less b/public/less/_repository.less index 093f35f831073..b906c97ec2607 100644 --- a/public/less/_repository.less +++ b/public/less/_repository.less @@ -1265,6 +1265,12 @@ margin: 0; } + td.message { + display: flex; + padding-top: 0; + padding-bottom: 0; + } + &.ui.basic.striped.table tbody tr:nth-child(2n) { background-color: rgba(0, 0, 0, 0.02) !important; } From bcda068b3dff498b8d25ca523bc4c07bd5381f62 Mon Sep 17 00:00:00 2001 From: Gary Kim Date: Fri, 9 Aug 2019 18:34:43 +0800 Subject: [PATCH 2/3] Fix multiple overflowing issues in commits table It was possible that the commit message would overflow hiding the expand commits button and commit status. This change ensures that the correct elements overflow without hiding anything else. This change also reverts using flex in the commits list because it was causing issues in Blink based browsers. Signed-off-by: Gary Kim --- public/css/index.css | 6 +++--- public/less/_repository.less | 8 +++----- templates/repo/commits_table.tmpl | 19 ++++++++++++------- 3 files changed, 18 insertions(+), 15 deletions(-) diff --git a/public/css/index.css b/public/css/index.css index d2104ecc1e201..f89e65c98e2b4 100644 --- a/public/css/index.css +++ b/public/css/index.css @@ -632,7 +632,7 @@ footer .ui.left,footer .ui.right{line-height:40px} .repository #commits-table thead .sha{width:140px} .repository #commits-table thead .shatd{text-align:center} .repository #commits-table td.sha .sha.label{margin:0} -.repository #commits-table td.message{display:flex;padding-top:0;padding-bottom: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 td.sha .sha.label,.repository #repo-files-table .sha.label{border:1px solid #bbb} .repository #commits-table td.sha .sha.label .detail.icon,.repository #repo-files-table .sha.label .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} @@ -828,8 +828,8 @@ footer .ui.left,footer .ui.right{line-height:40px} .stats-table .table-cell{display:table-cell} .stats-table .table-cell.tiny{height:.5em} 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 .commit-status-link{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 .commit-status-link{display:inline-block;vertical-align:middle} .commit-body{white-space:pre-wrap} .git-notes.top{text-align:left} .git-notes .commit-body{margin:0} diff --git a/public/less/_repository.less b/public/less/_repository.less index b906c97ec2607..5d858d974b21a 100644 --- a/public/less/_repository.less +++ b/public/less/_repository.less @@ -1266,9 +1266,7 @@ } td.message { - display: flex; - padding-top: 0; - padding-bottom: 0; + text-overflow: unset; } &.ui.basic.striped.table tbody tr:nth-child(2n) { @@ -2310,12 +2308,12 @@ tbody.commit-list { .commit-list .message-wrapper { overflow: hidden; text-overflow: ellipsis; - max-width: calc(100% - 24px); + max-width: calc(100% - 50px); display: inline-block; vertical-align: middle; } -.commit-list .message-wrapper .commit-status-link { +.commit-list .commit-status-link { display: inline-block; vertical-align: middle; } diff --git a/templates/repo/commits_table.tmpl b/templates/repo/commits_table.tmpl index ebeb87b93c1b4..0fbf926c96c5c 100644 --- a/templates/repo/commits_table.tmpl +++ b/templates/repo/commits_table.tmpl @@ -70,14 +70,19 @@ - - {{.Summary}} - {{if IsMultilineCommitMessage .Message}} - - - {{end}} + + + {{.Summary}} + + {{if IsMultilineCommitMessage .Message}} + + {{end}} + {{template "repo/commit_status" .Status}} + {{if IsMultilineCommitMessage .Message}} + + {{end}} - {{template "repo/commit_status" .Status}} + {{TimeSince .Author.When $.Lang}} From aeb1334e21b3b4e77ad30cb1ef00b5c96336f347 Mon Sep 17 00:00:00 2001 From: Gary Kim Date: Fri, 9 Aug 2019 19:04:38 +0800 Subject: [PATCH 3/3] Remove unnecessary html element and fix indentation issues --- templates/repo/commits_table.tmpl | 27 ++++++++++++--------------- 1 file changed, 12 insertions(+), 15 deletions(-) diff --git a/templates/repo/commits_table.tmpl b/templates/repo/commits_table.tmpl index 0fbf926c96c5c..7ea854103c081 100644 --- a/templates/repo/commits_table.tmpl +++ b/templates/repo/commits_table.tmpl @@ -46,11 +46,11 @@ {{if .User}} - {{if .User.FullName}} + {{if .User.FullName}}   {{.User.FullName}} - {{else}} + {{else}}   {{.Author.Name}} - {{end}} + {{end}} {{else}}   {{.Author.Name}} {{end}} @@ -70,19 +70,16 @@ - - - {{.Summary}} - - {{if IsMultilineCommitMessage .Message}} - - {{end}} - {{template "repo/commit_status" .Status}} - {{if IsMultilineCommitMessage .Message}} - - {{end}} + + {{.Summary}} - + {{if IsMultilineCommitMessage .Message}} + + {{end}} + {{template "repo/commit_status" .Status}} + {{if IsMultilineCommitMessage .Message}} + + {{end}} {{TimeSince .Author.When $.Lang}}