From 363eeb8cb51406c9e505e387fbdfa9e628754278 Mon Sep 17 00:00:00 2001
From: Martin Zurowietz <martin@zurowietz.de>
Date: Tue, 5 Nov 2024 09:21:18 +0100
Subject: [PATCH] Clip long typeahead item names

---
 resources/assets/js/core/components/typeaheadItem.vue | 2 +-
 resources/assets/sass/components/_typeahead.scss      | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/resources/assets/js/core/components/typeaheadItem.vue b/resources/assets/js/core/components/typeaheadItem.vue
index 6adff50a0..1ad563227 100644
--- a/resources/assets/js/core/components/typeaheadItem.vue
+++ b/resources/assets/js/core/components/typeaheadItem.vue
@@ -1,7 +1,7 @@
 <template>
 <li>
     <a href="#" @click.prevent="props.select(item)">
-        <span v-html="props.highlight(item)"></span>
+        <span class="typeahead-item-name" v-html="props.highlight(item)" :title="item.name"></span>
         <span v-if="info">
             <br><small class="typeahead-item-info" v-text="info" :title="info"></small>
         </span>
diff --git a/resources/assets/sass/components/_typeahead.scss b/resources/assets/sass/components/_typeahead.scss
index ee4c47481..e31f252b4 100644
--- a/resources/assets/sass/components/_typeahead.scss
+++ b/resources/assets/sass/components/_typeahead.scss
@@ -6,7 +6,7 @@
     display: block;
 }
 
-.typeahead-item-info {
+.typeahead-item-info, .typeahead-item-name {
     display: inline-block;
     max-width: 250px;
     text-overflow: ellipsis;