From c01452f890855b5765aa5ea2fcc36467da76c1b4 Mon Sep 17 00:00:00 2001
From: Cristhian Zanforlin Lousa <cristhian.lousa@gmail.com>
Date: Wed, 22 Jan 2025 11:37:25 -0300
Subject: [PATCH] refactor: adjust SliderComponent spacing and typography
 (#5836)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

🐛 (sliderComponent/index.tsx): adjust styling to fix alignment issue with input element in SliderComponent

Co-authored-by: Gabriel Luiz Freitas Almeida <gabriel@langflow.org>
---
 .../components/sliderComponent/index.tsx                     | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/frontend/src/components/core/parameterRenderComponent/components/sliderComponent/index.tsx b/src/frontend/src/components/core/parameterRenderComponent/components/sliderComponent/index.tsx
index 0820202d0..9216708fc 100644
--- a/src/frontend/src/components/core/parameterRenderComponent/components/sliderComponent/index.tsx
+++ b/src/frontend/src/components/core/parameterRenderComponent/components/sliderComponent/index.tsx
@@ -199,13 +199,14 @@ export default function SliderComponent({
   const ringClassInputClass = "ring-[1px] ring-slider-input-border";
 
   return (
-    <div className={cn("w-full rounded-lg", editNode && "mt-4")}>
+    <div className={cn("w-full rounded-lg", editNode && "mt-3")}>
       <Case condition={!sliderButtons}>
         <div className="noflow nowheel nopan nodelete nodrag flex items-center justify-end">
           <div
             className={clsx(
               "input-slider-text",
               (isGrabbing || isEditing) && ringClassInputClass,
+              editNode && "relative left-0.5",
             )}
           >
             {isEditing ? (
@@ -215,7 +216,7 @@ export default function SliderComponent({
                 onChange={handleInputChange}
                 onBlur={handleInputBlur}
                 onKeyDown={handleKeyDown}
-                className="relative bottom-[1px] w-full cursor-text rounded-sm bg-transparent text-center font-mono text-[0.88rem] arrow-hide"
+                className="relative bottom-[1px] w-full cursor-text rounded-sm bg-transparent text-center font-mono text-sm arrow-hide"
                 autoFocus
                 data-testid="slider_input"
               />