Merge branch '53768-diff-comment-action-btns' into 'master'

Fix alignment of diff comment buttons

Closes #53768

See merge request gitlab-org/gitlab-ce!22944

app/assets/javascripts/notes/components/noteable_discussion.vue

@@ -433,7 +433,7 @@ Please check your network connection and try again.`;
                     <div class="discussion-with-resolve-btn">
                       <button
                         type="button"
-                        class="js-vue-discussion-reply btn btn-text-field mr-2 qa-discussion-reply"
+                        class="js-vue-discussion-reply btn btn-text-field mr-sm-2 qa-discussion-reply"
                         title="Add a reply"
                         @click="showReplyForm"
                       >
@@ -442,7 +442,7 @@ Please check your network connection and try again.`;
                       <div v-if="discussion.resolvable">
                         <button
                           type="button"
-                          class="btn btn-default mx-sm-2"
+                          class="btn btn-default mr-sm-2"
                           @click="resolveHandler()"
                         >
                           <i
@@ -455,7 +455,7 @@ Please check your network connection and try again.`;
                       </div>
                       <div
                         v-if="discussion.resolvable"
-                        class="btn-group discussion-actions"
+                        class="btn-group discussion-actions ml-sm-2"
                         role="group"
                       >
                         <div

app/assets/stylesheets/pages/notes.scss

@@ -595,7 +595,6 @@ $note-form-margin-left: 70px;
 
 .discussion-actions {
   float: right;
-  margin-left: 10px;
   color: $gray-darkest;
 
   @include media-breakpoint-down(xs) {