Merge branch '52065-fix-environment-name-overlap' into 'master'

Fix environment name overlapping

Closes #52065

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

app/assets/javascripts/environments/components/environment_item.vue

@@ -466,7 +466,9 @@ export default {
     class="gl-responsive-table-row"
     role="row">
     <div
-      class="table-section section-wrap section-15"
+      v-tooltip
+      :title="model.name"
+      class="table-section section-wrap section-15 text-truncate"
       role="gridcell"
     >
       <div
@@ -480,9 +482,7 @@ export default {
         v-if="!model.isFolder"
         class="environment-name table-mobile-content">
         <a
-          v-tooltip
           :href="environmentPath"
-          :title="model.name"
         >
           {{ model.name }}
         </a>

changelogs/unreleased/22104-fix-environment-name-overlap.yml

@@ -0,0 +1,4 @@
+---
+title: "Fix the issue where long environment names aren't being truncated, causing the environment name to overlap into the column next to it."
+merge_request: 22104
+type: fixed