Adjust height and padding of merge request buttonswinh-merged-buttons-styling

3 files changed, 18 insertions, 7 deletions

diff --git a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_header.js b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_header.js
index f8b3fb748ae..bff063398a0 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_header.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_header.js
@@ -35,7 +35,7 @@ export default {
         <a
           href="#modal_merge_info"
           data-toggle="modal"
-          class="btn inline btn-grouped btn-sm">
+          class="btn inline btn-grouped btn-small">
           Check out branch
         </a>
         <span class="dropdown inline prepend-left-5">
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merged.js b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merged.js
index c7d32d18141..f2df60f1095 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merged.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merged.js
@@ -92,7 +92,7 @@ export default {
         class="merged-buttons clearfix">
         <a
           v-if="mr.canRevertInCurrentMR"
-          class="btn btn-close btn-sm has-tooltip"
+          class="btn btn-close btn-small has-tooltip"
           href="#modal-revert-commit"
           data-toggle="modal"
           data-container="body"
@@ -101,7 +101,7 @@ export default {
         </a>
         <a
           v-else-if="mr.revertInForkPath"
-          class="btn btn-close btn-sm has-tooltip"
+          class="btn btn-close btn-small has-tooltip"
           data-method="post"
           :href="mr.revertInForkPath"
           title="Revert this merge request in a new merge request">
@@ -109,7 +109,7 @@ export default {
         </a>
         <a
           v-if="mr.canCherryPickInCurrentMR"
-          class="btn btn-default btn-sm has-tooltip"
+          class="btn btn-default btn-small has-tooltip"
           href="#modal-cherry-pick-commit"
           data-toggle="modal"
           data-container="body"
@@ -118,7 +118,7 @@ export default {
         </a>
         <a
           v-else-if="mr.cherryPickInForkPath"
-          class="btn btn-default btn-sm has-tooltip"
+          class="btn btn-default btn-small has-tooltip"
           data-method="post"
           :href="mr.cherryPickInForkPath"
           title="Cherry-pick this merge request in a new merge request">
diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss
index 2dc7f73a295..ac71c91410f 100644
--- a/app/assets/stylesheets/pages/merge_requests.scss
+++ b/app/assets/stylesheets/pages/merge_requests.scss
@@ -82,6 +82,19 @@
     }
   }
 
+  .btn {
+    &.btn-small {
+      font-size: 15px;
+      line-height: 18px;
+      padding: 5px 10px;
+    }
+
+    &.btn-xs {
+      line-height: 19px;
+      padding: 2px 7px;
+    }
+  }
+
   .ci-widget {
     color: $gl-text-color;
     display: -webkit-flex;
@@ -221,8 +234,6 @@
     }
 
     .btn-group .btn {
-      padding: 5px 10px;
-
       &.dropdown-toggle {
         padding: 5px 7px;
       }