From bed84c6285fcb6beaedee0977e35ad0d869dee13 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Sat, 7 Mar 2026 11:42:54 -0600
Subject: [PATCH] Fix iOS Safari auto-zoom on input focus by ensuring 16px
 minimum font size on mobile

---
 src/components/ZapDialog.tsx         | 6 +++---
 src/components/auth/SignupDialog.tsx | 2 +-
 src/components/dm/DMChatArea.tsx     | 6 +++---
 src/components/ui/command.tsx        | 2 +-
 src/components/ui/input-otp.tsx      | 2 +-
 src/components/ui/select.tsx         | 2 +-
 src/components/ui/textarea.tsx       | 2 +-
 7 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/components/ZapDialog.tsx b/src/components/ZapDialog.tsx
index 7bafd89d..a1a457c8 100644
--- a/src/components/ZapDialog.tsx
+++ b/src/components/ZapDialog.tsx
@@ -107,7 +107,7 @@ const ZapContent = forwardRef<HTMLDivElement, ZapContentProps>(({
                 id="invoice"
                 value={invoice}
                 readOnly
-                className="font-mono text-xs min-w-0 flex-1 overflow-hidden text-ellipsis"
+                className="font-mono text-base md:text-xs min-w-0 flex-1 overflow-hidden text-ellipsis"
                 onClick={(e) => e.currentTarget.select()}
               />
               <Button
@@ -194,14 +194,14 @@ const ZapContent = forwardRef<HTMLDivElement, ZapContentProps>(({
             placeholder="Custom amount"
             value={amount}
             onChange={(e) => setAmount(e.target.value)}
-            className="w-full text-sm"
+            className="w-full"
           />
           <Textarea
             id="custom-comment"
             placeholder="Add a comment (optional)"
             value={comment}
             onChange={(e) => setComment(e.target.value)}
-            className="w-full resize-none text-sm"
+            className="w-full resize-none"
             rows={2}
           />
         </div>
diff --git a/src/components/auth/SignupDialog.tsx b/src/components/auth/SignupDialog.tsx
index 68e2b786..a50a56b6 100644
--- a/src/components/auth/SignupDialog.tsx
+++ b/src/components/auth/SignupDialog.tsx
@@ -185,7 +185,7 @@ const SignupDialog: React.FC<SignupDialogProps> = ({ isOpen, onClose }) => {
                   type={showKey ? "text" : "password"}
                   value={nsec}
                   readOnly
-                  className="pr-10 font-mono text-sm"
+                  className="pr-10 font-mono"
                 />
                 <Button
                   type="button"
diff --git a/src/components/dm/DMChatArea.tsx b/src/components/dm/DMChatArea.tsx
index 089062bc..f1d2e968 100644
--- a/src/components/dm/DMChatArea.tsx
+++ b/src/components/dm/DMChatArea.tsx
@@ -476,14 +476,14 @@ export const DMChatArea = ({ pubkey, onBack, className }: DMChatAreaProps) => {
               onValueChange={(value) => setSelectedProtocol(value as MessageProtocol)}
               disabled={!allowSelection}
             >
-              <SelectTrigger className="h-[32px] w-[90px] text-xs px-2">
+              <SelectTrigger className="h-[32px] w-[90px] text-base md:text-xs px-2">
                 <SelectValue />
               </SelectTrigger>
               <SelectContent>
-                <SelectItem value={MESSAGE_PROTOCOL.NIP17} className="text-xs">
+                <SelectItem value={MESSAGE_PROTOCOL.NIP17} className="text-base md:text-xs">
                   NIP-17
                 </SelectItem>
-                <SelectItem value={MESSAGE_PROTOCOL.NIP04} className="text-xs">
+                <SelectItem value={MESSAGE_PROTOCOL.NIP04} className="text-base md:text-xs">
                   NIP-04
                 </SelectItem>
               </SelectContent>
diff --git a/src/components/ui/command.tsx b/src/components/ui/command.tsx
index 69d63a47..ef3b1f94 100644
--- a/src/components/ui/command.tsx
+++ b/src/components/ui/command.tsx
@@ -44,7 +44,7 @@ const CommandInput = React.forwardRef<
     <CommandPrimitive.Input
       ref={ref}
       className={cn(
-        "flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
+        "flex h-11 w-full rounded-md bg-transparent py-3 text-base outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
         className
       )}
       {...props}
diff --git a/src/components/ui/input-otp.tsx b/src/components/ui/input-otp.tsx
index ebf5c281..01e16faa 100644
--- a/src/components/ui/input-otp.tsx
+++ b/src/components/ui/input-otp.tsx
@@ -39,7 +39,7 @@ const InputOTPSlot = React.forwardRef<
     <div
       ref={ref}
       className={cn(
-        "relative flex h-10 w-10 items-center justify-center border-y border-r border-input text-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md",
+        "relative flex h-10 w-10 items-center justify-center border-y border-r border-input text-base transition-all first:rounded-l-md first:border-l last:rounded-r-md md:text-sm",
         isActive && "z-10 ring-2 ring-ring ring-offset-background",
         className
       )}
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
index 798d0c39..ab691304 100644
--- a/src/components/ui/select.tsx
+++ b/src/components/ui/select.tsx
@@ -17,7 +17,7 @@ const SelectTrigger = React.forwardRef<
   <SelectPrimitive.Trigger
     ref={ref}
     className={cn(
-      "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
+      "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1 md:text-sm",
       className
     )}
     {...props}
diff --git a/src/components/ui/textarea.tsx b/src/components/ui/textarea.tsx
index 12c91369..acd41bce 100644
--- a/src/components/ui/textarea.tsx
+++ b/src/components/ui/textarea.tsx
@@ -9,7 +9,7 @@ const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
     return (
       <textarea
         className={cn(
-          "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+          "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
           className
         )}
         ref={ref}