From 67fbf75652f126487d1622d7a3495c183129c65b Mon Sep 17 00:00:00 2001
From: Thomas Kosiewski <tk@coder.com>
Date: Mon, 15 Dec 2025 07:40:19 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=A4=96=20fix:=20prevent=20Switch=20from?=
 =?UTF-8?q?=20becoming=20circular=20on=20mobile?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/browser/components/ui/switch.tsx | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/browser/components/ui/switch.tsx b/src/browser/components/ui/switch.tsx
index ece5531cbe..059aaec863 100644
--- a/src/browser/components/ui/switch.tsx
+++ b/src/browser/components/ui/switch.tsx
@@ -30,19 +30,25 @@ const Switch = React.forwardRef<HTMLButtonElement, SwitchProps>(
         disabled={disabled}
         onClick={() => onCheckedChange(!checked)}
         className={cn(
-          "inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors",
+          "inline-flex shrink-0 cursor-pointer items-center justify-center rounded-full",
           "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
           "disabled:cursor-not-allowed disabled:opacity-50",
-          checked ? "bg-accent" : "bg-zinc-600",
           className
         )}
       >
         <span
           className={cn(
-            "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform",
-            checked ? "translate-x-5" : "translate-x-0"
+            "pointer-events-none inline-flex h-6 w-11 items-center rounded-full border-2 border-transparent transition-colors",
+            checked ? "bg-accent" : "bg-zinc-600"
           )}
-        />
+        >
+          <span
+            className={cn(
+              "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform",
+              checked ? "translate-x-5" : "translate-x-0"
+            )}
+          />
+        </span>
       </button>
     );
   }