diff options
| -rw-r--r-- | templates/repo/pulls/status.tmpl | 18 | ||||
| -rw-r--r-- | web_src/less/_repository.less | 38 |
2 files changed, 48 insertions, 8 deletions
diff --git a/templates/repo/pulls/status.tmpl b/templates/repo/pulls/status.tmpl index b68802cd56..ca090ee843 100644 --- a/templates/repo/pulls/status.tmpl +++ b/templates/repo/pulls/status.tmpl @@ -18,14 +18,16 @@ {{end}} {{range $.LatestCommitStatuses}} - <div class="ui attached segment"> - <span>{{template "repo/commit_status" .}}</span> - <span class="ui">{{.Context}} <span class="text grey">{{.Description}}</span></span> - <div class="ui right"> - {{if $.is_context_required}} - {{if (call $.is_context_required .Context)}}<div class="ui label">{{$.locale.Tr "repo.pulls.status_checks_requested"}}</div>{{end}} - {{end}} - <span class="ui">{{if .TargetURL}}<a href="{{.TargetURL}}">{{$.locale.Tr "repo.pulls.status_checks_details"}}</a>{{end}}</span> + <div class="ui attached segment pr-status"> + {{template "repo/commit_status" .}} + <div class="status-context"> + <span>{{.Context}} <span class="text grey">{{.Description}}</span></span> + <div class="ui status-details"> + {{if $.is_context_required}} + {{if (call $.is_context_required .Context)}}<div class="ui label">{{$.locale.Tr "repo.pulls.status_checks_requested"}}</div>{{end}} + {{end}} + <span class="ui">{{if .TargetURL}}<a href="{{.TargetURL}}">{{$.locale.Tr "repo.pulls.status_checks_details"}}</a>{{end}}</span> + </div> </div> </div> {{end}} diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less index 039c471309..193a73c706 100644 --- a/web_src/less/_repository.less +++ b/web_src/less/_repository.less @@ -3477,3 +3477,41 @@ td.blob-excerpt { max-width: 165px; } } + +.pr-status { + padding: 0 !important; // To clear fomantic's padding on .ui.segment elements + display: flex; + align-items: center; + + .commit-status { + margin: 1em; + flex-shrink: 0; + } + + .status-context { + display: flex; + justify-content: space-between; + width: 100%; + + > span { + padding: 1em 0; + } + } + + .status-details { + display: flex; + padding-right: .5em; + align-items: center; + justify-content: flex-end; + + @media @mediaSm { + flex-direction: column; + align-items: flex-end; + justify-content: center; + } + + > span { + padding-right: .5em; // To match the alignment with the "required" label + } + } +} |