From 01aa0cda2aec93bf41c7670b6d75e4c2e29b80db Mon Sep 17 00:00:00 2001
From: mastercoms <mastercoms@tuta.io>
Date: Thu, 11 Jul 2024 20:11:49 -0400
Subject: [PATCH] fix rgb order and change handler

---
 src/components/items/ItemsInner.tsx | 48 ++++++++++++++++++++++++-----
 1 file changed, 40 insertions(+), 8 deletions(-)

diff --git a/src/components/items/ItemsInner.tsx b/src/components/items/ItemsInner.tsx
index 042a3646..55b50eb2 100644
--- a/src/components/items/ItemsInner.tsx
+++ b/src/components/items/ItemsInner.tsx
@@ -389,6 +389,14 @@ export default function ItemsInner({ playerClass, items, setResetKey }) {
                               min={0}
                               max={255}
                               step={1}
+                              onChange={(e) => {
+                                const newVal = parseInt(e.target.value);
+                                setLiveCrosshairColor((old) => ({
+                                  ...currentCrosshairColor,
+                                  ...old,
+                                  r: newVal,
+                                }));
+                              }}
                               onBlur={(e) => {
                                 const newVal = parseInt(e.target.value);
                                 const color = {
@@ -407,17 +415,25 @@ export default function ItemsInner({ playerClass, items, setResetKey }) {
                           </Col>
                           <Col>
                             <Form.Control
-                              placeholder="Blue"
-                              value={currentCrosshairColor.b}
+                              placeholder="Green"
+                              value={currentCrosshairColor.g}
                               type="number"
                               min={0}
                               max={255}
                               step={1}
+                              onChange={(e) => {
+                                const newVal = parseInt(e.target.value);
+                                setLiveCrosshairColor((old) => ({
+                                  ...currentCrosshairColor,
+                                  ...old,
+                                  g: newVal,
+                                }));
+                              }}
                               onBlur={(e) => {
                                 const newVal = parseInt(e.target.value);
                                 const color = {
                                   ...currentCrosshairColor,
-                                  b: newVal,
+                                  g: newVal,
                                 };
                                 setCrosshairColor(
                                   playerClass === "All-Class"
@@ -427,21 +443,29 @@ export default function ItemsInner({ playerClass, items, setResetKey }) {
                                 );
                               }}
                             />
-                            <Form.Text>Blue</Form.Text>
+                            <Form.Text>Green</Form.Text>
                           </Col>
                           <Col>
                             <Form.Control
-                              placeholder="Green"
-                              value={currentCrosshairColor.g}
+                              placeholder="Blue"
+                              value={currentCrosshairColor.b}
                               type="number"
                               min={0}
                               max={255}
                               step={1}
+                              onChange={(e) => {
+                                const newVal = parseInt(e.target.value);
+                                setLiveCrosshairColor((old) => ({
+                                  ...currentCrosshairColor,
+                                  ...old,
+                                  b: newVal,
+                                }));
+                              }}
                               onBlur={(e) => {
                                 const newVal = parseInt(e.target.value);
                                 const color = {
                                   ...currentCrosshairColor,
-                                  g: newVal,
+                                  b: newVal,
                                 };
                                 setCrosshairColor(
                                   playerClass === "All-Class"
@@ -451,7 +475,7 @@ export default function ItemsInner({ playerClass, items, setResetKey }) {
                                 );
                               }}
                             />
-                            <Form.Text>Green</Form.Text>
+                            <Form.Text>Blue</Form.Text>
                           </Col>
                           <Col>
                             <Form.Control
@@ -461,6 +485,14 @@ export default function ItemsInner({ playerClass, items, setResetKey }) {
                               min={0}
                               max={1}
                               step={0.01}
+                              onChange={(e) => {
+                                const newVal = parseInt(e.target.value);
+                                setLiveCrosshairColor((old) => ({
+                                  ...currentCrosshairColor,
+                                  ...old,
+                                  a: newVal,
+                                }));
+                              }}
                               onBlur={(e) => {
                                 const newVal = parseFloat(e.target.value);
                                 const color = {