Resolve "bad alignment in merge request widget (code climate, security report, etc.)"

app/assets/javascripts/vue_shared/components/reports/report_section.vue

@@ -149,7 +149,7 @@ export default {
         :status="statusIconName"
       />
       <div
-        class="media-body space-children d-flex"
+        class="media-body space-children d-flex flex-align-self-center"
       >
         <span
           class="js-code-text code-text"

ee/app/assets/stylesheets/pages/merge_requests.scss

@@ -50,6 +50,13 @@
   .approve-btn {
    vertical-align: baseline;
   }
+
+  .approvals-required-text {
+    svg {
+      position: relative;
+      top: 3px;
+    }
+  }
 }
 
 .approvals-footer {

ee/app/assets/stylesheets/pages/security_reports.scss

@@ -39,7 +39,6 @@
 }
 
 .mr-widget-grouped-section {
-
   .report-block-container {
     max-height: 170px;
     overflow: auto;
@@ -108,7 +107,6 @@
     svg {
       width: 16px;
       height: 16px;
-      top: 3px;
       left: -2px;
     }
   }
@@ -142,10 +140,6 @@
     word-wrap: break-word;
     word-break: break-all;
   }
-
-  .btn-help svg {
-    top: 5px;
-  }
 }
 
 .report-block-issue-code {