From daf6d1f8318b15abc72f701a753115e2f87b025d Mon Sep 17 00:00:00 2001
From: justin <justin@liquidator.optimal-reality.com>
Date: Sat, 30 May 2026 16:17:17 -0500
Subject: [PATCH] =?UTF-8?q?Always=20show=20QR=20code=20for=20phone=20photo?=
 =?UTF-8?q?=20upload=20=E2=80=94=20no=20click=20to=20reveal?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

QR code displayed inline below the upload button so truckers can
immediately scan with their phone to take a photo of their ID.
Clear instructions: 'Scan with your phone camera to take a photo'

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../components/intake/steps/DOTIntakeStep.astro | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/site/src/components/intake/steps/DOTIntakeStep.astro b/site/src/components/intake/steps/DOTIntakeStep.astro
index d4aba98..58fb846 100644
--- a/site/src/components/intake/steps/DOTIntakeStep.astro
+++ b/site/src/components/intake/steps/DOTIntakeStep.astro
@@ -244,6 +244,17 @@
             Add Photo of Your ID
           </button>
           <p style="font-size:11px;color:#94a3b8;text-align:center;margin:8px 0 0">Accepted formats: JPEG, PNG, PDF &middot; Max 15MB</p>
+          <!-- QR code for phone upload — always visible -->
+          <div style="margin-top:16px;padding:16px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;text-align:center">
+            <div style="display:flex;align-items:center;gap:12px;justify-content:center;margin-bottom:8px">
+              <div style="flex:1;height:1px;background:#d1d5db"></div>
+              <span style="font-size:12px;color:#64748b;font-weight:500">or use your phone</span>
+              <div style="flex:1;height:1px;background:#d1d5db"></div>
+            </div>
+            <img id="dot-id-qr-img" style="width:160px;height:160px;margin:0 auto;display:block;border-radius:4px" alt="Scan to upload from phone" />
+            <p style="font-size:12px;color:#475569;margin:8px 0 0;font-weight:500">Scan with your phone camera to take a photo of your ID</p>
+            <p style="font-size:11px;color:#94a3b8;margin:4px 0 0">The form will stay open on your computer while you snap the picture on your phone</p>
+          </div>
         </div>
       </div>
       <div class="pw-security-notice" style="margin-top:8px">
@@ -655,6 +666,12 @@
     handleIdFile(idInput.files?.[0]);
   });
 
+  // Auto-generate QR code for phone upload
+  var qrImg = document.getElementById("dot-id-qr-img");
+  if (qrImg) {
+    qrImg.src = "https://api.qrserver.com/v1/create-qr-code/?size=160x160&data=" + encodeURIComponent(window.location.href);
+  }
+
   // (webcam capture handled above via getUserMedia)
 
   } // end guard