diff options
-rw-r--r-- | integrations/issue_test.go | 10 | ||||
-rw-r--r-- | integrations/pull_create_test.go | 4 | ||||
-rw-r--r-- | integrations/pull_merge_test.go | 2 | ||||
-rw-r--r-- | options/locale/locale_en-US.ini | 1 | ||||
-rw-r--r-- | templates/repo/issue/view_content.tmpl | 16 | ||||
-rw-r--r-- | templates/repo/issue/view_content/comments.tmpl | 286 | ||||
-rw-r--r-- | templates/repo/issue/view_content/pull.tmpl | 4 | ||||
-rw-r--r-- | web_src/less/_repository.less | 171 | ||||
-rw-r--r-- | 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 1454d75885..9b1447bd8d 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 639e421e0e..5a0a3eda08 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, "<strike><i>XSS PR</i></strike>", 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 5a9283edcf..b5ac9406ac 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 50a48e6299..a565a754af 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 622c09dc02..b003342c3f 100644 --- a/templates/repo/issue/view_content.tmpl +++ b/templates/repo/issue/view_content.tmpl @@ -10,12 +10,12 @@ {{ $createdStr:= TimeSinceUnix .Issue.CreatedUnix $.Lang }} <div class="twelve wide column comment-list prevent-before-timeline"> - <ui class="ui comments timeline-line"> - <div id="{{.Issue.HashTag}}" class="comment"> + <ui class="ui timeline"> + <div id="{{.Issue.HashTag}}" class="timeline-item comment first"> {{if .Issue.OriginalAuthor }} - <span class="avatar"><img src="/img/avatar_default.png"></span> + <span class="timeline-avatar"><img src="/img/avatar_default.png"></span> {{else}} - <a class="avatar" {{if gt .Issue.Poster.ID 0}}href="{{.Issue.Poster.HomeLink}}"{{end}}> + <a class="timeline-avatar" {{if gt .Issue.Poster.ID 0}}href="{{.Issue.Poster.HomeLink}}"{{end}}> <img src="{{.Issue.Poster.RelAvatarLink}}"> </a> {{end}} @@ -67,8 +67,8 @@ {{end}} {{if .IsSigned}} {{ if and (or .IsRepoAdmin .HasIssuesOrPullsWritePermission (or (not .Issue.IsLocked))) (not .Repository.IsArchived) }} - <div class="comment form"> - <a class="avatar" href="{{.SignedUser.HomeLink}}"> + <div class="timeline-item comment form"> + <a class="timeline-avatar" href="{{.SignedUser.HomeLink}}"> <img src="{{.SignedUser.RelAvatarLink}}"> </a> <div class="content"> @@ -116,8 +116,8 @@ {{else}} {{if .IsSigned}} {{if .Repository.IsArchived}} - <div class="comment form"> - <a class="avatar" href="{{.SignedUser.HomeLink}}"> + <div class="timeline-item comment form"> + <a class="timeline-avatar" href="{{.SignedUser.HomeLink}}"> <img src="{{.SignedUser.RelAvatarLink}}"> </a> <div class="content"> diff --git a/templates/repo/issue/view_content/comments.tmpl b/templates/repo/issue/view_content/comments.tmpl index 022e96a02e..dc7d2db3c6 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}} - <div class="comment" id="{{.HashTag}}"> + <div class="timeline-item comment" id="{{.HashTag}}"> {{if .OriginalAuthor }} - <span class="avatar"><img src="/img/avatar_default.png"></span> + <span class="timeline-avatar"><img src="/img/avatar_default.png"></span> {{else}} - <a class="avatar" {{if gt .Poster.ID 0}}href="{{.Poster.HomeLink}}"{{end}}> + <a class="timeline-avatar" {{if gt .Poster.ID 0}}href="{{.Poster.HomeLink}}"{{end}}> <img src="{{.Poster.RelAvatarLink}}"> </a> {{end}} @@ -69,16 +69,16 @@ </div> </div> {{else if eq .Type 1}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-primitive-dot" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> <span class="text grey"><a href="{{.Poster.HomeLink}}">{{.Poster.GetDisplayName}}</a> {{$.i18n.Tr "repo.issues.reopened_at" .EventTag $createdStr | Safe}}</span> </div> {{else if eq .Type 2}} - <div class="event" id="{{.HashTag}}"> - <span class="issue-symbol">{{svg "octicon-circle-slash" 16}}</span> + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-circle-slash" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -98,8 +98,8 @@ {{ $refTr = "repo.issues.ref_reopening_from" }} {{end}} {{ $createdStr:= TimeSinceUnix .CreatedUnix $.Lang }} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-bookmark" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-bookmark" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -114,8 +114,8 @@ </div> </div> {{else if eq .Type 4}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-bookmark" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-bookmark" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -128,8 +128,8 @@ </div> {{else if eq .Type 7}} {{if .Label}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-tag" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -138,8 +138,8 @@ </div> {{end}} {{else if eq .Type 8}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-milestone" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -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}}</span> </div> {{else if eq .Type 9}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-person" 16}}</span> {{if gt .AssigneeID 0}} {{if .RemovedAssignee}} <a class="ui avatar image" href="{{.Assignee.HomeLink}}"> @@ -178,8 +178,8 @@ {{end}} </div> {{else if eq .Type 10}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-pencil" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -188,8 +188,8 @@ </span> </div> {{else if eq .Type 11}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-git-branch" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -198,16 +198,16 @@ </span> </div> {{else if eq .Type 12}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-clock" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> <span class="text grey"><a href="{{.Poster.HomeLink}}">{{.Poster.GetDisplayName}}</a> {{$.i18n.Tr "repo.issues.start_tracking_history" $createdStr | Safe}}</span> </div> {{else if eq .Type 13}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-clock" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -219,8 +219,8 @@ </div> </div> {{else if eq .Type 14}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-clock" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -231,16 +231,16 @@ </div> </div> {{else if eq .Type 15}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-clock" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> <span class="text grey"><a href="{{.Poster.HomeLink}}">{{.Poster.GetDisplayName}}</a> {{$.i18n.Tr "repo.issues.cancel_tracking_history" $createdStr | Safe}}</span> </div> {{else if eq .Type 16}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-clock" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -249,8 +249,8 @@ </span> </div> {{else if eq .Type 17}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-clock" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -259,8 +259,8 @@ </span> </div> {{else if eq .Type 18}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-clock" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -269,8 +269,8 @@ </span> </div> {{else if eq .Type 19}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-dependent" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -293,8 +293,8 @@ {{end}} </div> {{else if eq .Type 20}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-dependent" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -317,110 +317,132 @@ {{end}} </div> {{else if eq .Type 22}} - <div class="event" id="{{.HashTag}}"> - <span class="issue-symbol {{if eq .Review.Type 1}}green - {{- else if eq .Review.Type 2}}grey - {{- else if eq .Review.Type 3}}red - {{- else}}grey{{end}}">{{svg (printf "octicon-%s" .Review.Type.Icon) 16}}</span> - {{if .OriginalAuthor }} - {{else}} - <a class="ui avatar image"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}> - <img src="{{.Poster.RelAvatarLink}}"> - </a> - {{end}} - <span class="text grey"> + <div class="timeline-item-group"> + <div class="timeline-item event" id="{{.HashTag}}"> {{if .OriginalAuthor }} - <span class="text black"><i class="fa {{MigrationIcon $.Repository.GetOriginalURLHostname}}" aria-hidden="true"></i> {{ .OriginalAuthor }}</span><span class="text grey"> {{if $.Repository.OriginalURL}}</span><span class="text migrate">({{$.i18n.Tr "repo.migrated_from" $.Repository.OriginalURL $.Repository.GetOriginalURLHostname | Safe }}){{end}}</span> {{else}} - <a{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>{{.Poster.GetDisplayName}}</a> + <a class="timeline-avatar"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}> + <img src="{{.Poster.RelAvatarLink}}"> + </a> {{end}} + <span class="badge {{if eq .Review.Type 1}}green + {{- else if eq .Review.Type 2}}grey + {{- else if eq .Review.Type 3}}red + {{- else}}grey{{end}}">{{svg (printf "octicon-%s" .Review.Type.Icon) 16}}</span> + <span class="text grey"> + {{if .OriginalAuthor }} + <span class="text black"><i class="fa {{MigrationIcon $.Repository.GetOriginalURLHostname}}" aria-hidden="true"></i> {{ .OriginalAuthor }}</span><span class="text grey"> {{if $.Repository.OriginalURL}}</span><span class="text migrate">({{$.i18n.Tr "repo.migrated_from" $.Repository.OriginalURL $.Repository.GetOriginalURLHostname | Safe }}){{end}}</span> + {{else}} + <a{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>{{.Poster.GetDisplayName}}</a> + {{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}} - </span> + {{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}} + </span> + </div> {{if .Content}} - <div class="detail"> - {{svg "octicon-quote" 16}} - <span class="text grey has-emoji">{{.Content}}</span> + <div class="timeline-item comment"> + <div class="content"> + <div class="ui top attached header arrow-top"> + <span class="text grey"> + {{if .OriginalAuthor }} + <span class="text black"><i class="fa {{MigrationIcon $.Repository.GetOriginalURLHostname}}" aria-hidden="true"></i> {{ .OriginalAuthor }}</span><span class="text grey"> {{if $.Repository.OriginalURL}}</span><span class="text migrate">({{$.i18n.Tr "repo.migrated_from" $.Repository.OriginalURL $.Repository.GetOriginalURLHostname | Safe }}){{end}}</span> + {{else}} + <a{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>{{.Poster.GetDisplayName}}</a> + {{end}} + + {{$.i18n.Tr "repo.issues.review.left_comment" | Safe}} + </span> + </div> + <div class="ui attached segment"> + <div class="detail"> + <span class="text black has-emoji">{{.Content}}</span> + </div> + </div> </div> + </div> {{end}} - {{ range $filename, $lines := .Review.CodeComments}} - {{range $line, $comms := $lines}} - <div class="ui segments"> - <div class="ui segment"> - {{$invalid := (index $comms 0).Invalidated}} - {{if $invalid}} - <button id="show-outdated-{{(index $comms 0).ID}}" data-comment="{{(index $comms 0).ID}}" class="ui compact right labeled button show-outdated"> - {{svg "octicon-fold" 16}} - {{$.i18n.Tr "repo.issues.review.show_outdated"}} - </button> - <button id="hide-outdated-{{(index $comms 0).ID}}" data-comment="{{(index $comms 0).ID}}" class="hide ui compact right labeled button hide-outdated"> - {{svg "octicon-fold" 16}} - {{$.i18n.Tr "repo.issues.review.hide_outdated"}} - </button> - {{end}} - <a href="{{(index $comms 0).CodeCommentURL}}" class="file-comment">{{$filename}}</a> - </div> - {{$diff := (CommentMustAsDiff (index $comms 0))}} - {{if $diff}} - {{$file := (index $diff.Files 0)}} - <div id="code-preview-{{(index $comms 0).ID}}" class="ui table segment{{if $invalid}} hide{{end}}"> - <div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}}"> - <div class="file-body file-code code-view code-diff code-diff-unified"> - <table> - <tbody> - {{template "repo/diff/section_unified" dict "file" $file "root" $}} - </tbody> - </table> + {{if .Review.CodeComments}} + <div class="timeline-item event"> + {{ range $filename, $lines := .Review.CodeComments}} + {{range $line, $comms := $lines}} + <div class="ui segments"> + <div class="ui segment"> + {{$invalid := (index $comms 0).Invalidated}} + {{if $invalid}} + <button id="show-outdated-{{(index $comms 0).ID}}" data-comment="{{(index $comms 0).ID}}" class="ui compact right labeled button show-outdated"> + {{svg "octicon-fold" 16}} + {{$.i18n.Tr "repo.issues.review.show_outdated"}} + </button> + <button id="hide-outdated-{{(index $comms 0).ID}}" data-comment="{{(index $comms 0).ID}}" class="hide ui compact right labeled button hide-outdated"> + {{svg "octicon-fold" 16}} + {{$.i18n.Tr "repo.issues.review.hide_outdated"}} + </button> + {{end}} + <a href="{{(index $comms 0).CodeCommentURL}}" class="file-comment">{{$filename}}</a> + </div> + {{$diff := (CommentMustAsDiff (index $comms 0))}} + {{if $diff}} + {{$file := (index $diff.Files 0)}} + <div id="code-preview-{{(index $comms 0).ID}}" class="ui table segment{{if $invalid}} hide{{end}}"> + <div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}}"> + <div class="file-body file-code code-view code-diff code-diff-unified"> + <table> + <tbody> + {{template "repo/diff/section_unified" dict "file" $file "root" $}} + </tbody> + </table> + </div> </div> </div> - </div> - {{end}} - <div id="code-comments-{{(index $comms 0).ID}}" class="ui segment{{if $invalid}} hide{{end}}"> - <div class="ui comments"> - {{range $comms}} - {{ $createdSubStr:= TimeSinceUnix .CreatedUnix $.Lang }} - <div class="comment" id="{{.HashTag}}"> - <a class="avatar"> - <img src="{{.Poster.RelAvatarLink}}"> - </a> - <div class="content"> - <div class="code-comment-content"> - <a class="author" {{if gt .Poster.ID 0}}href="{{.Poster.HomeLink}}"{{end}}>{{.Poster.GetDisplayName}}</a> - <div class="metadata"> - <span class="date">{{$.i18n.Tr "repo.issues.commented_at" .HashTag $createdSubStr | Safe}}</span> - </div> - <div class="text"> - <div class="render-content markdown has-emoji"> - {{if .RenderedContent}} - {{.RenderedContent|Str2html}} - {{else}} - <span class="no-content">{{$.i18n.Tr "repo.issues.no_content"}}</span> - {{end}} + {{end}} + <div id="code-comments-{{(index $comms 0).ID}}" class="ui segment{{if $invalid}} hide{{end}}"> + <div class="ui comments"> + {{range $comms}} + {{ $createdSubStr:= TimeSinceUnix .CreatedUnix $.Lang }} + <div class="comment" id="{{.HashTag}}"> + <a class="avatar"> + <img src="{{.Poster.RelAvatarLink}}"> + </a> + <div class="content"> + <div class="code-comment-content"> + <a class="author" {{if gt .Poster.ID 0}}href="{{.Poster.HomeLink}}"{{end}}>{{.Poster.GetDisplayName}}</a> + <div class="metadata"> + <span class="date">{{$.i18n.Tr "repo.issues.commented_at" .HashTag $createdSubStr | Safe}}</span> + </div> + <div class="text"> + <div class="render-content markdown has-emoji"> + {{if .RenderedContent}} + {{.RenderedContent|Str2html}} + {{else}} + <span class="no-content">{{$.i18n.Tr "repo.issues.no_content"}}</span> + {{end}} + </div> + <div class="raw-content hide">{{.Content}}</div> </div> - <div class="raw-content hide">{{.Content}}</div> </div> </div> </div> - </div> - {{end}} + {{end}} + </div> + {{template "repo/diff/comment_form_datahandler" dict "hidden" true "reply" (index $comms 0).ReviewID "root" $ "comment" (index $comms 0)}} </div> - {{template "repo/diff/comment_form_datahandler" dict "hidden" true "reply" (index $comms 0).ReviewID "root" $ "comment" (index $comms 0)}} </div> - </div> + {{end}} {{end}} + </div> {{end}} </div> {{else if eq .Type 23}} - <div class="event" id="{{.HashTag}}"> - <span class="issue-symbol">{{svg "octicon-lock" 16}}</span> + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-lock" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -436,8 +458,8 @@ {{ end }} </div> {{else if eq .Type 24}} - <div class="event" id="{{.HashTag}}"> - <span class="issue-symbol">{{svg "octicon-key" 16}}</span> + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-key" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -447,8 +469,8 @@ </span> </div> {{else if eq .Type 25}} - <div class="event"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event"> + <span class="badge">{{svg "octicon-git-branch" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -457,8 +479,8 @@ </span> </div> {{else if eq .Type 26}} - <div class="event" id="{{.HashTag}}"> - {{svg "octicon-primitive-dot" 16}} + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-clock" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> @@ -469,8 +491,8 @@ </div> </div> {{else if eq .Type 27}} - <div class="event" id="{{.HashTag}}"> - <span class="issue-symbol">{{svg "octicon-eye" 16}}</span> + <div class="timeline-item event" id="{{.HashTag}}"> + <span class="badge">{{svg "octicon-eye" 16}}</span> <a class="ui avatar image" href="{{.Poster.HomeLink}}"> <img src="{{.Poster.RelAvatarLink}}"> </a> diff --git a/templates/repo/issue/view_content/pull.tmpl b/templates/repo/issue/view_content/pull.tmpl index baad7f864d..e580d95586 100644 --- a/templates/repo/issue/view_content/pull.tmpl +++ b/templates/repo/issue/view_content/pull.tmpl @@ -58,8 +58,8 @@ </div> </div> {{end}} -<div class="comment merge box"> - <a class="avatar text {{if .Issue.PullRequest.HasMerged}}purple +<div class="timeline-item comment merge box"> + <a class="timeline-avatar text {{if .Issue.PullRequest.HasMerged}}purple {{- else if .Issue.IsClosed}}grey {{- else if .IsPullWorkInProgress}}grey {{- else if .IsFilesConflicted}}grey diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less index cca31ee5f7..55f1cbb76e 100644 --- a/web_src/less/_repository.less +++ b/web_src/less/_repository.less @@ -716,13 +716,13 @@ z-index: -1; } - .timeline-line { + .timeline { position: relative; display: block; - width: 100%; - max-width: 100%; + margin-left: 40px; + padding-left: 16px; - &:before { + &:before { //ciara display: block; content: ""; position: absolute; @@ -730,18 +730,91 @@ margin-bottom: 14px; top: 0; bottom: 0; - left: 82px; + left: 30px; width: 2px; background-color: #f3f3f3; z-index: -1; } } - .comment { - .avatar { - width: @comment-avatar-width; + .timeline-item, + .timeline-item-group { + padding: 12px 0; + } + + .timeline-item-group { + .timeline-item { + padding-top: 8px; + padding-bottom: 8px; + } + } + + .timeline-item { + margin-left: 16px; + position: relative; + + .timeline-avatar { + position: absolute; + left: -72px; + img { + width: 40px; + height: 40px; + } + } + + &:first-child { + padding-top: 0 !important; + } + + &:last-child { + padding-bottom: 0 !important; } + .badge { + width: 32px; + height: 32px; + background-color: #fff; + border: 2px solid #eee; + border-radius: 50%; + display: flex; + float: left; + margin-left: -32px; + margin-top: -1px; + margin-right: 8px; + color: #444; + + .svg { + width: 28px; + height: 28px; + text-align: center; + line-height: 28px; + padding: 4px; + + &.octicon-circle-slash { + color: #bd2c00; + } + + &.octicon-primitive-dot { + color: #6cc644; + } + + &.octicon-comment { + margin-top: 2px; + } + } + } + + &.comment > .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 ffc6872cb3..d56b7b8eeb 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; } |