jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

refactor: adjust SliderComponent spacing and typography (#5836)

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

Co-authored-by: Gabriel Luiz Freitas Almeida <gabriel@langflow.org>
This commit is contained in:
Cristhian Zanforlin Lousa 2025-01-22 11:37:25 -03:00 • committed by GitHub
commit c01452f890
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 3 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/frontend/src/components/core/parameterRenderComponent/components/sliderComponent/index.tsx
View file

@ -199,13 +199,14 @@ export default function SliderComponent({
const ringClassInputClass = "ring-[1px] ring-slider-input-border"; const ringClassInputClass = "ring-[1px] ring-slider-input-border";
return ( return (
<div className={cn("w-full rounded-lg", editNode && "mt-4")}> <div className={cn("w-full rounded-lg", editNode && "mt-3")}>
<Case condition={!sliderButtons}> <Case condition={!sliderButtons}>
<div className="noflow nowheel nopan nodelete nodrag flex items-center justify-end"> <div className="noflow nowheel nopan nodelete nodrag flex items-center justify-end">
<div <div
className={clsx( className={clsx(
"input-slider-text", "input-slider-text",
(isGrabbing || isEditing) && ringClassInputClass, (isGrabbing || isEditing) && ringClassInputClass,
editNode && "relative left-0.5",
)} )}
> >
{isEditing ? ( {isEditing ? (
@ -215,7 +216,7 @@ export default function SliderComponent({
onChange={handleInputChange} onChange={handleInputChange}
onBlur={handleInputBlur} onBlur={handleInputBlur}
onKeyDown={handleKeyDown} 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 autoFocus
data-testid="slider_input" data-testid="slider_input"
/> />