rearrange uniform slider fields into a single row

compute-toys · Apr 7, 2024 · 8d315cd · 8d315cd
1 parent dd61612
commit 8d315cd
Showing 1 changed file with 21 additions and 19 deletions.
diff --git a/components/editor/uniformsliders.tsx b/components/editor/uniformsliders.tsx
@@ -230,6 +230,26 @@ const UniformSlider = (props: UniformSliderProps) => {
                 setSliderUniform={setSliderUniform}
                 sliderRefMap={props.sliderRefMap}
             />
+            <TextField
+                label="Min"
+                type="number"
+                value={sliderMinRange}
+                sx={{
+                    gridRow: '1',
+                    width: '80px',
+                    input: { color: getRainbowColor(props.index) },
+                    label: { color: getRainbowColor(props.index) }
+                }}
+                InputLabelProps={{
+                    shrink: true
+                }}
+                onChange={e => {
+                    const val = +e.target.value;
+                    if (val < sliderMaxRange) {
+                        setSliderMinRange(val);
+                    }
+                }}
+            />
             <Slider
                 aria-label={sliderUniform + ' slider'}
                 sx={{
@@ -250,30 +270,12 @@ const UniformSlider = (props: UniformSliderProps) => {
                     setSliderVal(newValue as number);
                 }}
             />
-            <TextField
-                label="Min"
-                type="number"
-                value={sliderMinRange}
-                sx={{
-                    width: '80px',
-                    input: { color: getRainbowColor(props.index) },
-                    label: { color: getRainbowColor(props.index) }
-                }}
-                InputLabelProps={{
-                    shrink: true
-                }}
-                onChange={e => {
-                    const val = +e.target.value;
-                    if (val < sliderMaxRange) {
-                        setSliderMinRange(val);
-                    }
-                }}
-            />
             <TextField
                 label="Max"
                 type="number"
                 value={sliderMaxRange}
                 sx={{
+                    gridRow: '1',
                     width: '80px',
                     input: { color: getRainbowColor(props.index) },
                     label: { color: getRainbowColor(props.index) }