diff --git a/app/assets/javascripts/super_sidebar/components/global_search/command_palette/search_item.vue b/app/assets/javascripts/super_sidebar/components/global_search/command_palette/search_item.vue index 0c658de5e5bb430abb76d0040f4a1c0a253e3160..c0ed53503095b552c21f1aaf271ddef116dac729 100644 --- a/app/assets/javascripts/super_sidebar/components/global_search/command_palette/search_item.vue +++ b/app/assets/javascripts/super_sidebar/components/global_search/command_palette/search_item.vue @@ -45,12 +45,12 @@ export default { aria-hidden="true" /> <gl-icon v-if="item.icon" class="gl-mr-3 gl-shrink-0" :name="item.icon" /> - <span class="gl-flex gl-flex-col"> - <span v-safe-html="highlightedName" class="gl-text-strong"></span> + <span class="gl-flex gl-w-full gl-min-w-0 gl-flex-col"> + <span v-safe-html="highlightedName" class="gl-truncate gl-text-strong"></span> <span v-if="item.namespace" v-safe-html="item.namespace" - class="gl-text-sm gl-text-subtle" + class="gl-truncate gl-text-sm gl-text-subtle" ></span> </span> </div> diff --git a/spec/frontend/super_sidebar/components/global_search/command_palette/__snapshots__/search_item_spec.js.snap b/spec/frontend/super_sidebar/components/global_search/command_palette/__snapshots__/search_item_spec.js.snap index 28c8b555406724f9ced48160d8562983bf5c7c21..08c769cbdd16bacd39a8a0b40bc7ad860a064059 100644 --- a/spec/frontend/super_sidebar/components/global_search/command_palette/__snapshots__/search_item_spec.js.snap +++ b/spec/frontend/super_sidebar/components/global_search/command_palette/__snapshots__/search_item_spec.js.snap @@ -15,10 +15,10 @@ exports[`SearchItem should render the item 1`] = ` src="https://www.gravatar.com/avatar/a9638f4ec70148d51e56bf05ad41e993?s=80&d=identicon" /> <span - class="gl-flex gl-flex-col" + class="gl-flex gl-flex-col gl-min-w-0 gl-w-full" > <span - class="gl-text-strong" + class="gl-text-strong gl-truncate" > Cole Dickinson </span> @@ -37,10 +37,10 @@ exports[`SearchItem should render the item 2`] = ` variant="current" /> <span - class="gl-flex gl-flex-col" + class="gl-flex gl-flex-col gl-min-w-0 gl-w-full" > <span - class="gl-text-strong" + class="gl-text-strong gl-truncate" > Manage > Activity </span> @@ -63,15 +63,15 @@ exports[`SearchItem should render the item 3`] = ` src="/project/avatar/1/avatar.png" /> <span - class="gl-flex gl-flex-col" + class="gl-flex gl-flex-col gl-min-w-0 gl-w-full" > <span - class="gl-text-strong" + class="gl-text-strong gl-truncate" > MockProject1 </span> <span - class="gl-text-sm gl-text-subtle" + class="gl-text-sm gl-text-subtle gl-truncate" > Gitlab Org / MockProject1 </span> @@ -94,10 +94,10 @@ exports[`SearchItem should render the item 4`] = ` src="" /> <span - class="gl-flex gl-flex-col" + class="gl-flex gl-flex-col gl-min-w-0 gl-w-full" > <span - class="gl-text-strong" + class="gl-text-strong gl-truncate" > Dismiss Cipher with no integrity </span>