Add latest changes from gitlab-org/gitlab@13-9-stable-eev13.9.0-rc42

1 files changed, 11 insertions, 10 deletions

diff --git a/app/assets/javascripts/performance_bar/components/detailed_metric.vue b/app/assets/javascripts/performance_bar/components/detailed_metric.vue
index 930c5e50511..de4bbb36141 100644
--- a/app/assets/javascripts/performance_bar/components/detailed_metric.vue
+++ b/app/assets/javascripts/performance_bar/components/detailed_metric.vue
@@ -1,5 +1,5 @@
 <script>
-import { GlButton, GlIcon, GlModal, GlModalDirective } from '@gitlab/ui';
+import { GlButton, GlModal, GlModalDirective } from '@gitlab/ui';
 import RequestWarning from './request_warning.vue';
 
 export default {
@@ -7,7 +7,6 @@ export default {
     RequestWarning,
     GlButton,
     GlModal,
-    GlIcon,
   },
   directives: {
     'gl-modal': GlModalDirective,
@@ -94,10 +93,10 @@ export default {
     data-qa-selector="detailed_metric_content"
   >
     <gl-button v-gl-modal="modalId" class="gl-mr-2" type="button" variant="link">
-      {{ metricDetailsLabel }}
+      <span class="gl-text-blue-300 gl-font-weight-bold">{{ metricDetailsLabel }}</span>
     </gl-button>
-    <gl-modal :modal-id="modalId" :title="header" size="lg" modal-class="gl-mt-7" scrollable>
-      <table class="table">
+    <gl-modal :modal-id="modalId" :title="header" size="lg" footer-class="d-none" scrollable>
+      <table class="table gl-table">
         <template v-if="detailsList.length">
           <tr v-for="(item, index) in detailsList" :key="index">
             <td>
@@ -116,14 +115,16 @@ export default {
                   {{ item[key] }}
                   <gl-button
                     v-if="keyIndex == 0 && item.backtrace"
-                    class="gl-ml-3"
+                    class="gl-ml-3 button-ellipsis-horizontal"
                     data-testid="backtrace-expand-btn"
-                    type="button"
+                    category="primary"
+                    variant="default"
+                    icon="ellipsis_h"
+                    size="small"
+                    :selected="itemHasOpenedBacktrace(index)"
                     :aria-label="__('Toggle backtrace')"
                     @click="toggleBacktrace(index)"
-                  >
-                    <gl-icon :size="12" name="ellipsis_h" />
-                  </gl-button>
+                  />
                 </div>
                 <pre v-if="itemHasOpenedBacktrace(index)" class="backtrace-row mt-2">{{
                   item.backtrace