Better styling for code review comment form (#11413)

Co-authored-by: techknowlogick <[email protected]>

Author: CirnoT

templates/repo/diff/section_unified.tmpl

@@ -28,8 +28,7 @@
 			{{$isNotPending := (not (eq (index $line.Comments 0).Review.Type 0))}}
 		<tr>
 			<td colspan="2" class="lines-num"></td>
-			<td class="lines-type-marker"></td>
-			<td class="add-comment-left add-comment-right">
+			<td class="add-comment-left add-comment-right" colspan="2">
 				{{if $resolved}}
 					<div class = "ui attached header">
 						<span class="ui grey text left"><b>{{$resolveDoer.Name}}</b> {{$.root.i18n.Tr "repo.issues.review.resolved_by"}}</span>

web_src/js/index.js

@@ -1242,7 +1242,7 @@ function initPullRequestReview() {
     if (!ntr.hasClass('add-comment')) {
       ntr = $(`<tr class="add-comment">${
         isSplit ? '<td class="lines-num"></td><td class="lines-type-marker"></td><td class="add-comment-left"></td><td class="lines-num"></td><td class="lines-type-marker"></td><td class="add-comment-right"></td>' :
-          '<td class="lines-num"></td><td class="lines-num"></td><td class="lines-type-marker"></td><td class="add-comment-left add-comment-right"></td>'
+          '<td class="lines-num"></td><td class="lines-num"></td><td class="add-comment-left add-comment-right" colspan="2"></td>'
       }</tr>`);
       tr.after(ntr);
     }

web_src/less/_review.less

@@ -74,9 +74,13 @@
         margin-top: 0;
     }
 
+    .comment-list {
+        padding-bottom: 10px;
+    }
+
     .footer {
         border-top: 1px solid #f1f1f1;
-        margin-top: 10px;
+        padding: 10px 0 10px 0;
 
         .markdown-info {
             display: inline-block;
@@ -101,7 +105,7 @@
     }
 
     form.comment-form-reply {
-        margin: 0 0 0 4em;
+        margin: 0 0 0 1em;
     }
 }