Merge pull request #6627 from uinstinct/toggleswitch

fix: toggle switch marker styling

Author: RomneyDa

gui/src/components/gui/Switch.tsx

@@ -26,22 +26,22 @@ const ToggleSwitch: React.FC<ToggleSwitchProps> = ({
       <div className="flex flex-row items-center gap-1">
         {isToggled && !!showIfToggled && showIfToggled}
         <div
-          className={`border-vsc-input-border bg-vsc-input-background flex items-center rounded-full border border-solid`}
+          className={`border-vsc-input-border bg-vsc-input-background relative flex items-center rounded-full border border-solid`}
           onClick={disabled ? undefined : onToggle}
           style={{
             height: size,
             width: size * 2,
             padding: size / 8,
           }}
         >
-          <div className="relative h-full w-full">
-            <div
-              className={`absolute left-1/4 top-0 h-full w-1/2 transform rounded-full border-[0.2px] border-solid transition-all ${isToggled ? "translate-x-1/2 brightness-150" : "-translate-x-1/2 brightness-75"}`}
-              style={{
-                backgroundColor: isToggled ? vscButtonBackground : "",
-              }}
-            />
-          </div>
+          <div
+            className={`absolute left-1/4 transform rounded-full border-[0.2px] border-solid transition-all ${isToggled ? "translate-x-1/2 brightness-150" : "-translate-x-1/2 brightness-75"}`}
+            style={{
+              backgroundColor: isToggled ? vscButtonBackground : "",
+              height: size,
+              width: size,
+            }}
+          />
         </div>
       </div>
     </div>