From 316e3d32f9e21bc62780b9787e4a78c2bb098244 Mon Sep 17 00:00:00 2001 From: Rachel Macfarlane Date: Fri, 4 May 2018 17:23:40 -0700 Subject: [PATCH] Small styling changes to comment editor contribution --- extensions/git-extended/src/review/reviewMode.ts | 2 +- .../electron-browser/commentsEditorContribution.ts | 4 ++-- .../comments/electron-browser/media/review.css | 13 +++++++------ 3 files changed, 10 insertions(+), 9 deletions(-) diff --git a/extensions/git-extended/src/review/reviewMode.ts b/extensions/git-extended/src/review/reviewMode.ts index a82623967ed..9fc8dce16ca 100644 --- a/extensions/git-extended/src/review/reviewMode.ts +++ b/extensions/git-extended/src/review/reviewMode.ts @@ -169,7 +169,7 @@ export class ReviewMode implements vscode.DecorationProvider { this._reply = { command: this._prNumber + '-post', - title: 'Add single comment' + title: 'Add comment' }; this._onDidChangeDecorations.fire(); diff --git a/src/vs/workbench/parts/comments/electron-browser/commentsEditorContribution.ts b/src/vs/workbench/parts/comments/electron-browser/commentsEditorContribution.ts index 5eaedb43f2f..de4b042323e 100644 --- a/src/vs/workbench/parts/comments/electron-browser/commentsEditorContribution.ts +++ b/src/vs/workbench/parts/comments/electron-browser/commentsEditorContribution.ts @@ -88,12 +88,12 @@ export class CommentNode { } constructor(public comment: modes.Comment, ) { this._domNode = $('div.review-comment').getHTMLElement(); - let avatar = $('span.float-left').appendTo(this._domNode).getHTMLElement(); + let avatar = $('div.avatar-container').appendTo(this._domNode).getHTMLElement(); let img = $('img.avatar').appendTo(avatar).getHTMLElement(); img.src = comment.gravatar; let commentDetailsContainer = $('.review-comment-contents').appendTo(this._domNode).getHTMLElement(); - let header = $('h4').appendTo(commentDetailsContainer).getHTMLElement(); + let header = $('div').appendTo(commentDetailsContainer).getHTMLElement(); let author = $('strong.author').appendTo(header).getHTMLElement(); author.innerText = comment.userName; this._body = $('comment-body').appendTo(commentDetailsContainer).getHTMLElement(); diff --git a/src/vs/workbench/parts/comments/electron-browser/media/review.css b/src/vs/workbench/parts/comments/electron-browser/media/review.css index 771ea0afe6b..8dacd587db6 100644 --- a/src/vs/workbench/parts/comments/electron-browser/media/review.css +++ b/src/vs/workbench/parts/comments/electron-browser/media/review.css @@ -26,14 +26,14 @@ .monaco-editor .review-widget .body .review-comment { margin-left: 20px; padding: 8px 16px 8px 0px; + display: flex; } -.monaco-editor .review-widget .body .review-comment .float-left { - float: left; +.monaco-editor .review-widget .body .review-comment .avatar-container { margin-top: 4px !important; } -.monaco-editor .review-widget .body .review-comment .float-left img.avatar { +.monaco-editor .review-widget .body .review-comment .avatar-container img.avatar { height: 28px; width: 28px; display: inline-block; @@ -45,7 +45,7 @@ } .monaco-editor .review-widget .body .review-comment .review-comment-contents { - margin-left: 44px; + margin-left: 20px; } .monaco-editor .review-widget .body pre { @@ -104,8 +104,8 @@ } .monaco-editor .review-widget .body .comment-form { - margin-left: 20px; - padding: 8px 16px 8px 0px; + margin: 0 20px; + padding: 8px 0; } .monaco-editor .review-widget .body .comment-form.expand .review-thread-reply-button { @@ -115,6 +115,7 @@ .monaco-editor .review-widget .body .comment-form.expand textarea, .monaco-editor .review-widget .body .comment-form.expand .form-actions { display: block; + box-sizing: border-box; } .monaco-editor .review-widget .body .comment-form .review-thread-reply-button { -- GitLab