Polish NIP-46 QR pairing layout

components/login-modal.html

@@ -252,17 +252,19 @@
             role="alert"
           ></div>
           <div data-nip46-handshake-panel class="space-y-3">
-            <div class="flex flex-col gap-4 sm:flex-row sm:items-start">
+            <div
+              class="flex flex-col items-center gap-5 sm:flex-row sm:items-start sm:gap-6"
+            >
               <div
-                class="flex h-48 w-48 items-center justify-center rounded-lg border border-border-strong bg-bg-muted"
+                class="flex aspect-square w-full max-w-sm items-center justify-center rounded-2xl border border-border-strong bg-white p-5 shadow-sm sm:mx-0 sm:max-w-md sm:flex-none sm:p-8"
                 data-nip46-qr
                 aria-hidden="true"
               >
-                <div class="text-center text-xs text-text-muted">
+                <div class="w-full text-center text-sm text-text-muted">
                   Generating connect code…
                 </div>
               </div>
-              <div class="flex-1 space-y-2">
+              <div class="flex-1 space-y-2 sm:min-w-0">
                 <label class="block text-sm font-medium text-text" for="nip46HandshakeUri">
                   Connect URI
                 </label>
@@ -276,7 +278,12 @@
                   readonly
                 ></textarea>
                 <div class="flex flex-wrap items-center gap-2">
-                  <button type="button" class="btn-ghost text-sm" data-nip46-copy-uri disabled>
+                  <button
+                    type="button"
+                    class="btn-ghost w-full text-sm sm:w-auto"
+                    data-nip46-copy-uri
+                    disabled
+                  >
                     Copy link
                   </button>
                 </div>