third_party
/
gitea
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Code comments improvements (#15722)

Browse Source 
- Right-align the Reply and Resolve buttons
- Center Resolved text and add some padding
- Add padding to inline comments
- Indent the comment content to align with author name
- Re-parent form to allow better button layout space.

Co-authored-by: zeripath <art27@cantab.net>
tokarchuk/v1.17
silverwind 4 years ago committed by GitHub
parent 24ad131221
commit 2a9b8d173a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 65 additions and 41 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 7
      templates/repo/diff/comment_form.tmpl
  2. 26
      templates/repo/diff/conversation.tmpl
  3. 42
      templates/repo/issue/view_content/comments.tmpl
  4. 4
      web_src/js/index.js
  5. 9
      web_src/less/_base.less
  6. 8
      web_src/less/_repository.less
  7. 10
      web_src/less/_review.less

7
templates/repo/diff/comment_form.tmpl
Unescape View File

@ -1,9 +1,4 @@
{{if and $.root.SignedUserID (not $.Repository.IsArchived)}}
{{if $.hidden}}
<button class="comment-form-reply ui green labeled icon tiny button">
{{svg "octicon-reply" 16 "reply icon mr-2"}}{{$.root.i18n.Tr "repo.diff.comment.reply"}}
</button>
{{end}}
<form class="ui form {{if $.hidden}}hide comment-form comment-form-reply{{end}}" action="{{$.root.Issue.HTMLURL}}/files/reviews/comments" method="post">
{{$.root.CsrfTokenHtml}}
<input type="hidden" name="origin" value="{{if $.root.PageIsPullFiles}}diff{{else}}timeline{{end}}">
@ -26,7 +21,7 @@
{{.i18n.Tr "loading"}}
</div>
</div>
<div class="field footer">
<div class="field footer mx-3">
<span class="markup-info">{{svg "octicon-markup"}} {{$.root.i18n.Tr "repo.diff.comment.markup_info"}}</span>
<div class="ui right">
{{if $.reply}}

26
templates/repo/diff/conversation.tmpl
Unescape View File

@ -5,6 +5,7 @@
{{if $resolved}}
<div class="ui attached header resolved-placeholder df ac sb">
<div class="ui grey text">
{{svg "octicon-check" 16 "icon mr-2"}}
<b>{{$resolveDoer.Name}}</b> {{$.i18n.Tr "repo.issues.review.resolved_by"}}
</div>
<div>
@ -25,15 +26,22 @@
{{template "repo/diff/comments" dict "root" $ "comments" .comments}}
</ui>
</div>
<div class="df je ac fw mt-3">
{{if and $.CanMarkConversation $isNotPending}}
<button class="ui icon tiny basic button resolve-conversation" data-origin="diff" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{(index .comments 0).ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation">
{{if $resolved}}
{{$.i18n.Tr "repo.issues.review.un_resolve_conversation"}}
{{else}}
{{$.i18n.Tr "repo.issues.review.resolve_conversation"}}
{{end}}
</button>
{{end}}
{{if and $.SignedUserID (not $.Repository.IsArchived)}}
<button class="comment-form-reply ui green tiny labeled icon button ml-2 mr-0">
{{svg "octicon-reply" 16 "reply icon mr-2"}}{{$.i18n.Tr "repo.diff.comment.reply"}}
</button>
{{end}}
</div>
{{template "repo/diff/comment_form_datahandler" dict "hidden" true "reply" (index .comments 0).ReviewID "root" $ "comment" (index .comments 0)}}
{{if and $.CanMarkConversation $isNotPending}}
<button class="ui icon tiny button resolve-conversation" data-origin="diff" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{(index .comments 0).ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation" >
{{if $resolved}}
{{$.i18n.Tr "repo.issues.review.un_resolve_conversation"}}
{{else}}
{{$.i18n.Tr "repo.issues.review.resolve_conversation"}}
{{end}}
</button>
{{end}}
</div>
</div>

42
templates/repo/issue/view_content/comments.tmpl
Unescape View File

@ -508,11 +508,11 @@
</div>
</div>
{{end}}
<div id="code-comments-{{(index $comms 0).ID}}" class="comment-code-cloud ui segment{{if $resolved}} hide{{end}} py-3">
<div id="code-comments-{{(index $comms 0).ID}}" class="comment-code-cloud ui segment{{if $resolved}} hide{{end}} p-3">
<div class="ui comments mb-0">
{{range $comms}}
{{ $createdSubStr:= TimeSinceUnix .CreatedUnix $.Lang }}
<div class="comment code-comment" id="{{.HashTag}}">
<div class="comment code-comment pb-4" id="{{.HashTag}}">
<div class="content">
<div class="header comment-header">
<div class="comment-header-left df ac">
@ -572,21 +572,33 @@
</div>
{{end}}
</div>
{{template "repo/diff/comment_form_datahandler" dict "hidden" true "reply" (index $comms 0).ReviewID "root" $ "comment" (index $comms 0)}}
{{if and $.CanMarkConversation $isNotPending}}
<button class="ui tiny button resolve-conversation" data-origin="timeline" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{(index $comms 0).ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation" >
<div class="df ac fw mt-3 mb-2 mx-3">
<div class="f1">
{{if $resolved}}
{{$.i18n.Tr "repo.issues.review.un_resolve_conversation"}}
{{else}}
{{$.i18n.Tr "repo.issues.review.resolve_conversation"}}
<div class="ui grey text">
{{svg "octicon-check" 16 "mr-2"}}
<b>{{$resolveDoer.Name}}</b> {{$.i18n.Tr "repo.issues.review.resolved_by"}}
</div>
{{end}}
</button>
{{end}}
{{if $resolved}}
<span class="ui grey text"><b>{{$resolveDoer.Name}}</b> {{$.i18n.Tr "repo.issues.review.resolved_by"}}</span>
{{end}}
</div>
<div>
{{if and $.CanMarkConversation $isNotPending}}
<button class="ui tiny basic button resolve-conversation" data-origin="timeline" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{(index $comms 0).ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation">
{{if $resolved}}
{{$.i18n.Tr "repo.issues.review.un_resolve_conversation"}}
{{else}}
{{$.i18n.Tr "repo.issues.review.resolve_conversation"}}
{{end}}
</button>
{{end}}
{{if and $.SignedUserID (not $.Repository.IsArchived)}}
<button class="comment-form-reply ui green tiny labeled icon button ml-2 mr-0">
{{svg "octicon-reply" 16 "reply icon mr-2"}}{{$.i18n.Tr "repo.diff.comment.reply"}}
</button>
{{end}}
</div>
</div>
{{template "repo/diff/comment_form_datahandler" dict "hidden" true "reply" (index $comms 0).ReviewID "root" $ "comment" (index $comms 0)}}
</div>
</div>
{{end}}

4
web_src/js/index.js
Unescape View File

@ -1175,7 +1175,7 @@ async function initRepository() {
const form = $(e.currentTarget).closest('form');
if (form.length > 0 && form.hasClass('comment-form')) {
form.addClass('hide');
form.parent().find('button.comment-form-reply').show();
form.closest('.comment-code-cloud').find('button.comment-form-reply').show();
} else {
form.closest('.comment-code-cloud').remove();
}
@ -1339,7 +1339,7 @@ function initPullRequestReview() {
$(document).on('click', 'button.comment-form-reply', function (e) {
e.preventDefault();
$(this).hide();
const form = $(this).parent().find('.comment-form');
const form = $(this).closest('.comment-code-cloud').find('.comment-form');
form.removeClass('hide');
const $textarea = form.find('textarea');
let $simplemde;

9
web_src/less/_base.less
Unescape View File

@ -469,6 +469,10 @@ a.ui.card:hover,
border-top-color: var(--color-secondary-light-1) !important;
}
.ui.comments .comment .text {
margin: 0;
}
.ui.comments .comment .text,
.ui.comments .comment .author {
color: var(--color-text);
@ -1633,6 +1637,11 @@ a.ui.label:hover {
border-color: var(--color-light-border);
}
.ui.labeled.icon.buttons > .button > .icon,
.ui.labeled.icon.button > .icon {
background: var(--color-hover);
}
.ui.blue.button,
.ui.blue.buttons .button,
.ui.primary.button,

8
web_src/less/_repository.less
Unescape View File

@ -1058,7 +1058,7 @@
.code-comment {
border: 1px solid transparent;
padding: .5rem 0;
padding: .25rem .5rem;
margin: 0;
.content {
@ -1076,6 +1076,10 @@
}
}
.comment-content {
margin-left: 36px;
}
.avatar.image {
width: 28px;
height: 28px;
@ -1094,7 +1098,7 @@
}
button.comment-form-reply {
margin-left: 0;
margin: 0;
}
}

10
web_src/less/_review.less
Unescape View File

@ -112,14 +112,10 @@
display: block;
}
}
}
button.comment-form-reply {
margin: .5em .5em .5em 4.5em;
}
form.comment-form-reply {
margin: 0 0 0 1em;
}
.diff-file-body .comment-form {
margin: 0 0 0 3em;
}
.file-comment {

Write Preview
Loading…
Cancel
Save