From 4a85bffb1faba656dbdbc20787f91a4efffa55b5 Mon Sep 17 00:00:00 2001
From: Christian Byrne <cbyrne@comfy.org>
Date: Sat, 31 Jan 2026 15:57:38 -0800
Subject: [PATCH] fix: node header on preview has a gap on the right (not
 flush) (#8487)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Summary

After changes:

[Screencast from 2026-01-30
00-34-59.webm](https://github.com/user-attachments/assets/9111b8ce-936d-4b30-8b56-6f44aabfe009)

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-8487-fix-node-header-on-preview-has-a-gap-on-the-right-not-flush-2f86d73d365081f38cabfca9ab9e04e4)
by [Unito](https://www.unito.io)
---
 src/components/node/NodePreview.test.ts | 8 --------
 src/components/node/NodePreview.vue     | 2 +-
 2 files changed, 1 insertion(+), 9 deletions(-)

diff --git a/src/components/node/NodePreview.test.ts b/src/components/node/NodePreview.test.ts
index e52687d42..a5dae5638 100644
--- a/src/components/node/NodePreview.test.ts
+++ b/src/components/node/NodePreview.test.ts
@@ -76,14 +76,6 @@ describe('NodePreview', () => {
     expect(wrapper.find('._sb_preview_badge').text()).toBe('Preview')
   })
 
-  it('applies text-ellipsis class to node header for text truncation', () => {
-    const wrapper = mountComponent()
-    const nodeHeader = wrapper.find('.node_header')
-
-    expect(nodeHeader.classes()).toContain('text-ellipsis')
-    expect(nodeHeader.classes()).toContain('mr-4')
-  })
-
   it('sets title attribute on node header with full display name', () => {
     const wrapper = mountComponent()
     const nodeHeader = wrapper.find('.node_header')
diff --git a/src/components/node/NodePreview.vue b/src/components/node/NodePreview.vue
index 107ee3471..9734d5b43 100644
--- a/src/components/node/NodePreview.vue
+++ b/src/components/node/NodePreview.vue
@@ -10,7 +10,7 @@ https://github.com/Nuked88/ComfyUI-N-Sidebar/blob/7ae7da4a9761009fb6629bc04c6830
   <div v-else class="_sb_node_preview bg-component-node-background">
     <div class="_sb_table">
       <div
-        class="node_header mr-4 text-ellipsis"
+        class="node_header text-ellipsis"
         :title="nodeDef.display_name"
         :style="{
           backgroundColor: litegraphColors.NODE_DEFAULT_COLOR,