attempt to reuse some issue list styles...

app/assets/javascripts/issuable/related_issues/components/related_issue.vue

@@ -81,18 +81,26 @@ export default {
 </script>
 
 <template>
-  <div class="flex-row">
+  <div class="flex-row issue-info-container">
     <component
-      v-tooltip
       :is="this.computedLinkElementType"
       ref="link"
-      class="issue-token-link"
       :href="computedPath"
       :title="title"
-      data-placement="top">
-      <span
+      data-placement="top"
+      class="issue-main-info"
+    >
+      <div
+        v-if="hasTitle"
+        ref="title"
+        class="issue-title block-truncated"
+        :class="{ 'issue-token-title-standalone': !canRemove }"
+      >
+        {{ title }}
+      </div>
+      <div
         ref="reference"
-        class="issue-token-reference">
+        class="issuable-info">
         <i
           ref="stateIcon"
           v-if="hasState"
@@ -104,16 +112,7 @@ export default {
           :aria-label="state">
         </i>
         {{ displayReference }}
-      </span>
-      <span
-        v-if="hasTitle"
-        ref="title"
-        class="js-issue-token-title issue-token-title"
-        :class="{ 'issue-token-title-standalone': !canRemove }">
-        <span class="issue-token-title-text">
-          {{ title }}
-        </span>
-      </span>
+      </div>
     </component>
     <button
       v-if="canRemove"

app/assets/javascripts/issuable/related_issues/components/related_issues_block.vue

@@ -160,7 +160,7 @@ export default {
             label="Fetching related issues" />
         </div>
         <ul
-          class="flex-list content-list">
+          class="flex-list content-list issuable-list">
           <li
             :key="issue.id"
             v-for="issue in relatedIssues"

app/assets/stylesheets/pages/issuable.scss

@@ -691,6 +691,7 @@
       .issue-main-info {
         flex: 1 auto;
         margin-right: 10px;
+        min-width: 0;
       }
 
       .issuable-meta {

app/assets/stylesheets/pages/issues/related_issues.scss

@@ -18,7 +18,7 @@ $token_spacing_bottom: 0.5em;
 }
 
 .related-issues-token-body {
-  padding-bottom: calc(#{$gl-padding} - #{$token_spacing_bottom});
+  padding: 0 0 0 $gl-padding;
   transition-property: max-height, padding, opacity;
   transition-duration: $general-hover-transition-duration;
   transition-timing-function: $general-hover-transition-curve;