From 74d6bf7e01fca36b0a915c7c9d4e4284300979c4 Mon Sep 17 00:00:00 2001
From: Yuval Adam <_@yuv.al>
Date: Mon, 23 Sep 2024 16:53:54 +0200
Subject: Fix slider styles

---
 app/components/Slider.tsx | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

(limited to 'app')

diff --git a/app/components/Slider.tsx b/app/components/Slider.tsx
index 50223fc..330206f 100644
--- a/app/components/Slider.tsx
+++ b/app/components/Slider.tsx
@@ -12,7 +12,7 @@ interface GeshemSliderProps {
 }
 
 export function Slider({ playback, slider, setSlider }: GeshemSliderProps) {
-  const handleStyle = {
+  const handle = {
     height: 40,
     width: 40,
     border: 0,
@@ -20,24 +20,26 @@ export function Slider({ playback, slider, setSlider }: GeshemSliderProps) {
     boxShadow: ".5px .5px 2px 1px rgba(0,0,0,.32)"
   };
 
-  const railStyle = {
+  const rail = {
     height: 20,
     backgroundColor: "#3498db"
   };
 
-  const trackStyle = {
+  const track = {
     display: "none"
   };
 
+  const styles = {
+    handle, rail, track
+  }
+
   return (
     <div id="slider">
       <CustomSlider
         min={0}
         max={playback ? PLAYBACK_SLOTS : 9}
         defaultValue={slider}
-        handleStyle={handleStyle}
-        railStyle={railStyle}
-        trackStyle={trackStyle}
+        styles={styles}
         onChange={val => setSlider(val)}
       />
     </div>
-- 
cgit v1.3.1