Merge branch '39290-fix-border-of-readme-when-vue_file_list-enabled' into 'master'

Fix top border of README in vue_file_list

Closes #39290

See merge request gitlab-org/gitlab!21578

app/assets/javascripts/repository/components/preview/index.vue

@@ -35,12 +35,14 @@ export default {
 
 <template>
   <article class="file-holder limited-width-container readme-holder">
-    <div class="file-title">
+    <div class="js-file-title file-title-flex-parent">
+      <div class="file-header-content">
         <i aria-hidden="true" class="fa fa-file-text-o fa-fw"></i>
         <gl-link :href="blob.webUrl">
           <strong>{{ blob.name }}</strong>
         </gl-link>
       </div>
+    </div>
     <div class="blob-viewer">
       <gl-loading-icon v-if="loading > 0" size="md" class="my-4 mx-auto" />
       <div v-else-if="readme" v-html="readme.html"></div>

changelogs/unreleased/39290-fix-border-of-readme-when-vue_file_list-enabled.yml

+---
+title: Fix top border of README in vue_file_list
+merge_request: 21578
+author: Hector Bustillos
+type: fixed

spec/frontend/repository/components/preview/__snapshots__/index_spec.js.snap

@@ -5,7 +5,10 @@ exports[`Repository file preview component renders file HTML 1`] = `
   class="file-holder limited-width-container readme-holder"
 >
   <div
-    class="file-title"
+    class="js-file-title file-title-flex-parent"
+  >
+    <div
+      class="file-header-content"
     >
       <i
         aria-hidden="true"
@@ -20,6 +23,7 @@ exports[`Repository file preview component renders file HTML 1`] = `
         </strong>
       </gllink-stub>
     </div>
+  </div>
    
   <div
     class="blob-viewer"