From cff3f4a67e7ecf1123b9c5c5483336023157c16c Mon Sep 17 00:00:00 2001
From: jeanpaul <jeanpaul@users.noreply.github.com>
Date: Tue, 26 Aug 2025 17:51:40 +0200
Subject: [PATCH] fix(editor): Remove the enlarged thumb-target area for the
 scrollbar (#18810)

---
 .../src/components/N8nScrollArea/N8nScrollArea.vue | 14 ++------------
 1 file changed, 2 insertions(+), 12 deletions(-)

diff --git a/packages/frontend/@n8n/design-system/src/components/N8nScrollArea/N8nScrollArea.vue b/packages/frontend/@n8n/design-system/src/components/N8nScrollArea/N8nScrollArea.vue
index 7281d9074b8..ebb1ebf8774 100644
--- a/packages/frontend/@n8n/design-system/src/components/N8nScrollArea/N8nScrollArea.vue
+++ b/packages/frontend/@n8n/design-system/src/components/N8nScrollArea/N8nScrollArea.vue
@@ -118,6 +118,7 @@ const viewportStyle = computed(() => {
 	padding: var(--spacing-5xs);
 	background: transparent;
 	transition: background 160ms ease-out;
+	pointer-events: none;
 
 	&:hover {
 		background: var(--color-foreground-light);
@@ -138,18 +139,7 @@ const viewportStyle = computed(() => {
 	background: var(--color-foreground-base);
 	border-radius: 4px;
 	position: relative;
-
-	&::before {
-		content: '';
-		position: absolute;
-		top: 50%;
-		left: 50%;
-		transform: translate(-50%, -50%);
-		width: 100%;
-		height: 100%;
-		min-width: 44px;
-		min-height: 44px;
-	}
+	pointer-events: auto;
 
 	&:hover {
 		background: var(--color-foreground-dark);