Merge branch '48515-sql-queries-are-not-shown-from-the-performance-bar-in-safari' into 'master'

Resolve "SQL Queries are not shown from the Performance Bar in Safari"

Closes #48515

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

app/assets/javascripts/performance_bar/components/performance_bar_app.vue

@@ -113,7 +113,7 @@ export default {
   >
     <div
       v-if="currentRequest"
-      class="container-fluid container-limited"
+      class="d-flex container-fluid container-limited"
     >
       <div
         id="peek-view-host"
@@ -179,6 +179,7 @@ export default {
         v-if="currentRequest"
         :current-request="currentRequest"
         :requests="requests"
+        class="ml-auto"
         @change-current-request="changeCurrentRequest"
       />
     </div>

app/assets/javascripts/performance_bar/components/request_selector.vue

@@ -35,10 +35,7 @@ export default {
 };
 </script>
 <template>
-  <div
-    id="peek-request-selector"
-    class="float-right"
-  >
+  <div id="peek-request-selector">
     <select v-model="currentRequestId">
       <option
         v-for="request in requests"

app/assets/stylesheets/performance_bar.scss

@@ -7,7 +7,6 @@
   top: 0;
   width: 100%;
   z-index: 2000;
-  overflow-x: hidden;
 
   height: $performance-bar-height;
   background: $black;
@@ -82,7 +81,7 @@
 
   .view {
     margin-right: 15px;
-    float: left;
+    flex-shrink: 0;
 
     &:last-child {
       margin-right: 0;

changelogs/unreleased/48515-sql-queries-are-not-shown-from-the-performance-bar-in-safari.yml

@@ -0,0 +1,5 @@
+---
+title: Fix performance bar modal visibility in Safari
+merge_request:
+author:
+type: fixed