Fix MR Popovers text in dark mode

app/assets/javascripts/mr_popover/components/mr_popover.vue

@@ -100,13 +100,13 @@ export default {
           <div :class="`issuable-status-box status-box ${statusBoxClass}`">
             {{ stateHumanName }}
           </div>
-          <span class="text-secondary">Opened <time v-text="formattedTime"></time></span>
+          <span class="gl-text-secondary">Opened <time v-text="formattedTime"></time></span>
         </div>
         <ci-icon v-if="detailedStatus" :status="detailedStatus" />
       </div>
       <h5 v-if="!$apollo.queries.mergeRequest.loading" class="my-2">{{ title }}</h5>
       <!-- eslint-disable @gitlab/vue-require-i18n-strings -->
-      <div class="text-secondary">
+      <div class="gl-text-secondary">
         {{ `${projectPath}!${mergeRequestIID}` }}
       </div>
       <!-- eslint-enable @gitlab/vue-require-i18n-strings -->

spec/frontend/mr_popover/__snapshots__/mr_popover_spec.js.snap

@@ -26,7 +26,7 @@ exports[`MR Popover loaded state matches the snapshot 1`] = `
         </div>
          
         <span
-          class="text-secondary"
+          class="gl-text-secondary"
         >
           Opened 
           <time>
@@ -49,7 +49,7 @@ exports[`MR Popover loaded state matches the snapshot 1`] = `
     </h5>
      
     <div
-      class="text-secondary"
+      class="gl-text-secondary"
     >
       
       foo/bar!1
@@ -80,7 +80,7 @@ exports[`MR Popover shows skeleton-loader while apollo is loading 1`] = `
     <!---->
      
     <div
-      class="text-secondary"
+      class="gl-text-secondary"
     >
       
       foo/bar!1