From c97e9883801d28ca44b8b7049a4285c8d904eea8 Mon Sep 17 00:00:00 2001 From: Sorien Date: Sat, 11 Apr 2020 00:01:41 +0200 Subject: [PATCH] Prettify Timeline (#10972) Co-authored-by: mrsdizzie --- integrations/issue_test.go | 10 +- integrations/pull_create_test.go | 4 +- integrations/pull_merge_test.go | 2 +- options/locale/locale_en-US.ini | 1 + templates/repo/issue/view_content.tmpl | 16 +- .../repo/issue/view_content/comments.tmpl | 286 ++++++++++-------- templates/repo/issue/view_content/pull.tmpl | 4 +- web_src/less/_repository.less | 171 +++++++---- web_src/less/themes/theme-arc-green.less | 18 +- 9 files changed, 296 insertions(+), 216 deletions(-) diff --git a/integrations/issue_test.go b/integrations/issue_test.go index 1454d7588..9b1447bd8 100644 --- a/integrations/issue_test.go +++ b/integrations/issue_test.go @@ -139,7 +139,7 @@ func testNewIssue(t *testing.T, session *TestSession, user, repo, title, content htmlDoc = NewHTMLParser(t, resp.Body) val := htmlDoc.doc.Find("#issue-title").Text() assert.Equal(t, title, val) - val = htmlDoc.doc.Find(".comment-list .comments .comment .render-content p").First().Text() + val = htmlDoc.doc.Find(".comment .render-content p").First().Text() assert.Equal(t, content, val) return issueURL @@ -154,7 +154,7 @@ func testIssueAddComment(t *testing.T, session *TestSession, issueURL, content, link, exists := htmlDoc.doc.Find("#comment-form").Attr("action") assert.True(t, exists, "The template has changed") - commentCount := htmlDoc.doc.Find(".comment-list .comments .comment .render-content").Length() + commentCount := htmlDoc.doc.Find(".comment-list .comment .render-content").Length() req = NewRequestWithValues(t, "POST", link, map[string]string{ "_csrf": htmlDoc.GetCSRF(), @@ -168,10 +168,10 @@ func testIssueAddComment(t *testing.T, session *TestSession, issueURL, content, htmlDoc = NewHTMLParser(t, resp.Body) - val := htmlDoc.doc.Find(".comment-list .comments .comment .render-content p").Eq(commentCount).Text() + val := htmlDoc.doc.Find(".comment-list .comment .render-content p").Eq(commentCount).Text() assert.Equal(t, content, val) - idAttr, has := htmlDoc.doc.Find(".comment-list .comments .comment").Eq(commentCount).Attr("id") + idAttr, has := htmlDoc.doc.Find(".comment-list .comment").Eq(commentCount).Attr("id") idStr := idAttr[strings.LastIndexByte(idAttr, '-')+1:] assert.True(t, has) id, err := strconv.Atoi(idStr) @@ -197,7 +197,7 @@ func TestIssueCommentClose(t *testing.T) { req := NewRequest(t, "GET", issueURL) resp := session.MakeRequest(t, req, http.StatusOK) htmlDoc := NewHTMLParser(t, resp.Body) - val := htmlDoc.doc.Find(".comment-list .comments .comment .render-content p").First().Text() + val := htmlDoc.doc.Find(".comment-list .comment .render-content p").First().Text() assert.Equal(t, "Description", val) } diff --git a/integrations/pull_create_test.go b/integrations/pull_create_test.go index 639e421e0..5a0a3eda0 100644 --- a/integrations/pull_create_test.go +++ b/integrations/pull_create_test.go @@ -98,10 +98,10 @@ func TestPullCreate_TitleEscape(t *testing.T) { req = NewRequest(t, "GET", url) resp = session.MakeRequest(t, req, http.StatusOK) htmlDoc = NewHTMLParser(t, resp.Body) - titleHTML, err := htmlDoc.doc.Find(".comments .event .text b").First().Html() + titleHTML, err := htmlDoc.doc.Find(".comment-list .timeline-item.event .text b").First().Html() assert.NoError(t, err) assert.Equal(t, "<i>XSS PR</i>", titleHTML) - titleHTML, err = htmlDoc.doc.Find(".comments .event .text b").Next().Html() + titleHTML, err = htmlDoc.doc.Find(".comment-list .timeline-item.event .text b").Next().Html() assert.NoError(t, err) assert.Equal(t, "<u>XSS PR</u>", titleHTML) }) diff --git a/integrations/pull_merge_test.go b/integrations/pull_merge_test.go index 5a9283edc..b5ac9406a 100644 --- a/integrations/pull_merge_test.go +++ b/integrations/pull_merge_test.go @@ -49,7 +49,7 @@ func testPullCleanUp(t *testing.T, session *TestSession, user, repo, pullnum str // Click the little green button to create a pull htmlDoc := NewHTMLParser(t, resp.Body) - link, exists := htmlDoc.doc.Find(".comments .merge .delete-button").Attr("data-url") + link, exists := htmlDoc.doc.Find(".timeline-item .delete-button").Attr("data-url") assert.True(t, exists, "The template has changed") req = NewRequestWithValues(t, "POST", link, map[string]string{ "_csrf": htmlDoc.GetCSRF(), diff --git a/options/locale/locale_en-US.ini b/options/locale/locale_en-US.ini index 50a48e629..a565a754a 100644 --- a/options/locale/locale_en-US.ini +++ b/options/locale/locale_en-US.ini @@ -1053,6 +1053,7 @@ issues.review.self.approval = You cannot approve your own pull request. issues.review.self.rejection = You cannot request changes on your own pull request. issues.review.approve = "approved these changes %s" issues.review.comment = "reviewed %s" +issues.review.left_comment = left a comment issues.review.content.empty = You need to leave a comment indicating the requested change(s). issues.review.reject = "requested changes %s" issues.review.wait = "was requested for review %s" diff --git a/templates/repo/issue/view_content.tmpl b/templates/repo/issue/view_content.tmpl index 622c09dc0..b003342c3 100644 --- a/templates/repo/issue/view_content.tmpl +++ b/templates/repo/issue/view_content.tmpl @@ -10,12 +10,12 @@ {{ $createdStr:= TimeSinceUnix .Issue.CreatedUnix $.Lang }}
- -
+ +
{{if .Issue.OriginalAuthor }} - + {{else}} - + {{end}} @@ -67,8 +67,8 @@ {{end}} {{if .IsSigned}} {{ if and (or .IsRepoAdmin .HasIssuesOrPullsWritePermission (or (not .Issue.IsLocked))) (not .Repository.IsArchived) }} -
- +
+
@@ -116,8 +116,8 @@ {{else}} {{if .IsSigned}} {{if .Repository.IsArchived}} -
- +
+
diff --git a/templates/repo/issue/view_content/comments.tmpl b/templates/repo/issue/view_content/comments.tmpl index 022e96a02..dc7d2db3c 100644 --- a/templates/repo/issue/view_content/comments.tmpl +++ b/templates/repo/issue/view_content/comments.tmpl @@ -9,11 +9,11 @@ 22 = REVIEW, 23 = ISSUE_LOCKED, 24 = ISSUE_UNLOCKED, 25 = TARGET_BRANCH_CHANGED, 26 = DELETE_TIME_MANUAL, 27 = REVIEW_REQUEST --> {{if eq .Type 0}} -
+
{{if .OriginalAuthor }} - + {{else}} - + {{end}} @@ -69,16 +69,16 @@
{{else if eq .Type 1}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-primitive-dot" 16}} {{.Poster.GetDisplayName}} {{$.i18n.Tr "repo.issues.reopened_at" .EventTag $createdStr | Safe}}
{{else if eq .Type 2}} -
- {{svg "octicon-circle-slash" 16}} +
+ {{svg "octicon-circle-slash" 16}} @@ -98,8 +98,8 @@ {{ $refTr = "repo.issues.ref_reopening_from" }} {{end}} {{ $createdStr:= TimeSinceUnix .CreatedUnix $.Lang }} -
- {{svg "octicon-bookmark" 16}} +
+ {{svg "octicon-bookmark" 16}} @@ -114,8 +114,8 @@
{{else if eq .Type 4}} -
- {{svg "octicon-bookmark" 16}} +
+ {{svg "octicon-bookmark" 16}} @@ -128,8 +128,8 @@
{{else if eq .Type 7}} {{if .Label}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-tag" 16}} @@ -138,8 +138,8 @@
{{end}} {{else if eq .Type 8}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-milestone" 16}} @@ -147,8 +147,8 @@ {{if gt .OldMilestoneID 0}}{{if gt .MilestoneID 0}}{{$.i18n.Tr "repo.issues.change_milestone_at" (.OldMilestone.Name|Escape) (.Milestone.Name|Escape) $createdStr | Safe}}{{else}}{{$.i18n.Tr "repo.issues.remove_milestone_at" (.OldMilestone.Name|Escape) $createdStr | Safe}}{{end}}{{else if gt .MilestoneID 0}}{{$.i18n.Tr "repo.issues.add_milestone_at" (.Milestone.Name|Escape) $createdStr | Safe}}{{end}}
{{else if eq .Type 9}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-person" 16}} {{if gt .AssigneeID 0}} {{if .RemovedAssignee}} @@ -178,8 +178,8 @@ {{end}}
{{else if eq .Type 10}} -
- {{svg "octicon-primitive-dot" 16}} + {{else if eq .Type 11}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-git-branch" 16}} @@ -198,16 +198,16 @@
{{else if eq .Type 12}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-clock" 16}} {{.Poster.GetDisplayName}} {{$.i18n.Tr "repo.issues.start_tracking_history" $createdStr | Safe}}
{{else if eq .Type 13}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-clock" 16}} @@ -219,8 +219,8 @@
{{else if eq .Type 14}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-clock" 16}} @@ -231,16 +231,16 @@
{{else if eq .Type 15}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-clock" 16}} {{.Poster.GetDisplayName}} {{$.i18n.Tr "repo.issues.cancel_tracking_history" $createdStr | Safe}}
{{else if eq .Type 16}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-clock" 16}} @@ -249,8 +249,8 @@
{{else if eq .Type 17}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-clock" 16}} @@ -259,8 +259,8 @@
{{else if eq .Type 18}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-clock" 16}} @@ -269,8 +269,8 @@
{{else if eq .Type 19}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-dependent" 16}} @@ -293,8 +293,8 @@ {{end}}
{{else if eq .Type 20}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-dependent" 16}} @@ -317,110 +317,132 @@ {{end}}
{{else if eq .Type 22}} -
- {{svg (printf "octicon-%s" .Review.Type.Icon) 16}} - {{if .OriginalAuthor }} - {{else}} - - - - {{end}} - +
+
{{if .OriginalAuthor }} - {{ .OriginalAuthor }} {{if $.Repository.OriginalURL}}({{$.i18n.Tr "repo.migrated_from" $.Repository.OriginalURL $.Repository.GetOriginalURLHostname | Safe }}){{end}} {{else}} - {{.Poster.GetDisplayName}} + + + {{end}} + {{svg (printf "octicon-%s" .Review.Type.Icon) 16}} + + {{if .OriginalAuthor }} + {{ .OriginalAuthor }} {{if $.Repository.OriginalURL}}({{$.i18n.Tr "repo.migrated_from" $.Repository.OriginalURL $.Repository.GetOriginalURLHostname | Safe }}){{end}} + {{else}} + {{.Poster.GetDisplayName}} + {{end}} - {{if eq .Review.Type 1}} - {{$.i18n.Tr "repo.issues.review.approve" $createdStr | Safe}} - {{else if eq .Review.Type 2}} - {{$.i18n.Tr "repo.issues.review.comment" $createdStr | Safe}} - {{else if eq .Review.Type 3}} - {{$.i18n.Tr "repo.issues.review.reject" $createdStr | Safe}} - {{else}} - {{$.i18n.Tr "repo.issues.review.comment" $createdStr | Safe}} - {{end}} - + {{if eq .Review.Type 1}} + {{$.i18n.Tr "repo.issues.review.approve" $createdStr | Safe}} + {{else if eq .Review.Type 2}} + {{$.i18n.Tr "repo.issues.review.comment" $createdStr | Safe}} + {{else if eq .Review.Type 3}} + {{$.i18n.Tr "repo.issues.review.reject" $createdStr | Safe}} + {{else}} + {{$.i18n.Tr "repo.issues.review.comment" $createdStr | Safe}} + {{end}} + +
{{if .Content}} -
- {{svg "octicon-quote" 16}} - {{.Content}} +
+
+
+ + {{if .OriginalAuthor }} + {{ .OriginalAuthor }} {{if $.Repository.OriginalURL}}({{$.i18n.Tr "repo.migrated_from" $.Repository.OriginalURL $.Repository.GetOriginalURLHostname | Safe }}){{end}} + {{else}} + {{.Poster.GetDisplayName}} + {{end}} + + {{$.i18n.Tr "repo.issues.review.left_comment" | Safe}} + +
+
+
+ {{.Content}} +
+
+
{{end}} - {{ range $filename, $lines := .Review.CodeComments}} - {{range $line, $comms := $lines}} -
-
- {{$invalid := (index $comms 0).Invalidated}} - {{if $invalid}} - - - {{end}} - {{$filename}} -
- {{$diff := (CommentMustAsDiff (index $comms 0))}} - {{if $diff}} - {{$file := (index $diff.Files 0)}} -
-
-
- - - {{template "repo/diff/section_unified" dict "file" $file "root" $}} - -
+ {{if .Review.CodeComments}} +
+ {{ range $filename, $lines := .Review.CodeComments}} + {{range $line, $comms := $lines}} +
+
+ {{$invalid := (index $comms 0).Invalidated}} + {{if $invalid}} + + + {{end}} + {{$filename}} +
+ {{$diff := (CommentMustAsDiff (index $comms 0))}} + {{if $diff}} + {{$file := (index $diff.Files 0)}} +
+
+
+ + + {{template "repo/diff/section_unified" dict "file" $file "root" $}} + +
+
-
- {{end}} -
-
- {{range $comms}} - {{ $createdSubStr:= TimeSinceUnix .CreatedUnix $.Lang }} -
- - - -
-
- {{.Poster.GetDisplayName}} - -
-
- {{if .RenderedContent}} - {{.RenderedContent|Str2html}} - {{else}} - {{$.i18n.Tr "repo.issues.no_content"}} - {{end}} + {{end}} +
+
+ {{range $comms}} + {{ $createdSubStr:= TimeSinceUnix .CreatedUnix $.Lang }} +
+ + + +
+
+ {{.Poster.GetDisplayName}} + +
+
+ {{if .RenderedContent}} + {{.RenderedContent|Str2html}} + {{else}} + {{$.i18n.Tr "repo.issues.no_content"}} + {{end}} +
+
{{.Content}}
-
{{.Content}}
-
- {{end}} + {{end}} +
+ {{template "repo/diff/comment_form_datahandler" dict "hidden" true "reply" (index $comms 0).ReviewID "root" $ "comment" (index $comms 0)}}
- {{template "repo/diff/comment_form_datahandler" dict "hidden" true "reply" (index $comms 0).ReviewID "root" $ "comment" (index $comms 0)}}
-
+ {{end}} {{end}} +
{{end}}
{{else if eq .Type 23}} -
- {{svg "octicon-lock" 16}} +
+ {{svg "octicon-lock" 16}} @@ -436,8 +458,8 @@ {{ end }}
{{else if eq .Type 24}} -
- {{svg "octicon-key" 16}} +
+ {{svg "octicon-key" 16}} @@ -447,8 +469,8 @@
{{else if eq .Type 25}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-git-branch" 16}} @@ -457,8 +479,8 @@
{{else if eq .Type 26}} -
- {{svg "octicon-primitive-dot" 16}} +
+ {{svg "octicon-clock" 16}} @@ -469,8 +491,8 @@
{{else if eq .Type 27}} -
- {{svg "octicon-eye" 16}} +
+ {{svg "octicon-eye" 16}} diff --git a/templates/repo/issue/view_content/pull.tmpl b/templates/repo/issue/view_content/pull.tmpl index baad7f864..e580d9558 100644 --- a/templates/repo/issue/view_content/pull.tmpl +++ b/templates/repo/issue/view_content/pull.tmpl @@ -58,8 +58,8 @@
{{end}} -
- + .content { + margin-left: -16px; + } + + &.event > .text { + line-height: 30px; + } + } + + .comment { + .tag { color: #767676; margin-top: 3px; @@ -778,8 +851,6 @@ } .content { - margin-left: 4em; - > .header { #avatar-arrow; font-weight: normal; @@ -787,7 +858,6 @@ position: relative; color: #767676; background-color: #f7f7f7; - border-bottom: 1px solid #eeeeee; border-top-left-radius: 3px; border-top-right-radius: 3px; @@ -796,6 +866,29 @@ padding-top: 10px; padding-bottom: 10px; } + + &.arrow-top::before, + &.arrow-top::after { + transform: rotate(90deg); + } + + &.arrow-top::before { + top: -9px; + left: 6px; + } + + &.arrow-top::after { + top: -8px; + left: 7px; + } + + .actions a { + color: rgba(0, 0, 0, .4); + + &:hover { + color: rgba(0, 0, 0, .8); + } + } } > .merge-section { @@ -892,9 +985,7 @@ } .event { - position: relative; - margin: 15px 0 15px 79px; - padding-left: 25px; + padding-left: 15px; & > .svg:not(.issue-symbol) { text-shadow: -2px 0 #fff, 0 2px #fff, 2px 0 #fff, 0 -2px #fff; @@ -935,46 +1026,6 @@ } } - .svg { - width: 30px; - float: left; - text-align: center; - - &.octicon-circle-slash { - margin-top: 5px; - margin-left: -35.5px; - height: 20px; - color: #bd2c00; - } - - &.octicon-primitive-dot { - margin-top: -1px; - margin-left: -35.5px; - margin-right: -1px; - height: 30px; - color: #6cc644; - } - - &.octicon-bookmark { - margin-top: 2px; - margin-left: -35.5px; - margin-right: -1px; - height: 25px; - } - - &.octicon-eye { - margin-top: 3px; - margin-left: -35.5px; - margin-right: 0; - height: 22px; - } - - &.octicon-x { - margin-left: -35.5px; - height: 25px; - } - } - .detail { font-size: .9rem; margin-top: 5px; @@ -986,11 +1037,11 @@ } } } - } - } - .ui.segment.metas { - margin-top: -3px; + .segments { + box-shadow: none; + } + } } .ui.participants { @@ -2169,8 +2220,8 @@ .select-reaction { float: left; - padding: .5em; - padding-left: 1em; + padding: .4em; + line-height: 21px; &:not(.active) a { display: none; diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less index ffc6872cb..d56b7b8ee 100644 --- a/web_src/less/themes/theme-arc-green.less +++ b/web_src/less/themes/theme-arc-green.less @@ -672,13 +672,13 @@ a.ui.basic.green.label:hover { color: #dbdbdb !important; } -.ui.comments .comment .actions a { - color: #9e9e9e; +.ui .comment .actions a { + color: #9e9e9e !important; } -.ui.comments .comment .actions a.active, -.ui.comments .comment .actions a:hover { - color: #fff; +.ui .comment .actions a.active, +.ui .comment .actions a:hover { + color: #fff !important; } .repository.view.issue .comment-list .comment .content .header:after { @@ -698,10 +698,16 @@ a.ui.basic.green.label:hover { } .repository.view.issue .comment-list:not(.prevent-before-timeline):before, -.repository.view.issue .comment-list .timeline-line:before { +.repository.view.issue .comment-list .timeline:before { background-color: #3b4954; } +.repository.view.issue .comment-list .timeline-item .badge { + background-color: #383c4a; + border-color: #3b4954; + color: #9e9e9e; +} + .repository .comment.form .content .form:after { border-right-color: #313c47; }