Clip long typeahead item names

biigle · Nov 5, 2024 · 363eeb8 · 363eeb8
1 parent 77ec4ae
commit 363eeb8
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 2 deletions.
diff --git 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
@@ -6,7 +6,7 @@
     display: block;
 }
 
-.typeahead-item-info {
+.typeahead-item-info, .typeahead-item-name {
     display: inline-block;
     max-width: 250px;
     text-overflow: ellipsis;