From 377bff9ccbb8d591f5a47b3dba8f8d8b99295ca0 Mon Sep 17 00:00:00 2001
From: Nirzara Ghure <113231114+nirzaraghure@users.noreply.github.com>
Date: Sun, 12 Apr 2026 06:53:27 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=A4=96=20AppGenius:=20AI-generated=20code?=
 =?UTF-8?q?=20fix?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html | 70 ++++++++++++++++++++++++++++++------------------------
 1 file changed, 39 insertions(+), 31 deletions(-)
diff --git a/index.html b/index.html
index f5ac2ac..caec1b0 100644
--- a/index.html
+++ b/index.html
@@ -1,9 +1,20 @@
-
+```html
 <!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>QR Code Maker</title>
+    <style>
+        .qr-wrapper {
+            max-width: 400px;
+            margin: 40px auto;
+            padding: 20px;
+            background-color: #f7f7f7;
+            border: 1px solid #ccc;
+            box-shadow: 0 0 10px rgba(0,0,0,0.1);
+        }
+    </style>
 </head>
 
 <body>
@@ -13,8 +24,8 @@
     <h2>Create QR Code</h2>
     <p>Type any text, link, or contact information to create a QR code.</p>
 
-    <label>Input Text or URL:</label>
-    <input type="text" id="qrInput" placeholder="Paste link or text here..." />
+    <label for="qrInput">Input Text or URL:</label>
+    <input type="text" id="qrInput" placeholder="Paste link or text here..." required />
 
     <button id="createBtn">Create QR</button>
 
@@ -25,38 +36,35 @@ <h2>Create QR Code</h2>
 <script src="https://cdn.jsdelivr.net/npm/qrcodejs@1.0.0/qrcode.min.js"></script>
 
 <script>
+    let qrInstance;
+
+    document.getElementById("createBtn").addEventListener("click", function () {
+        const value = document.getElementById("qrInput").value.trim();
+        const container = document.getElementById("qrOutput");
+
+        if (value === "") {
+            alert("Please enter some text or URL");
+            return;
+        }
+
+        container.innerHTML = "";
+        qrInstance = new QRCode(container, {
+            text: value,
+            width: 200,
+            height: 200
+        });
+    });
 
-let qrInstance;
-
-document.getElementById("createBtn").addEventListener("click", function () {
-
-    const value = document.getElementById("qrInput").value.trim();
-    const container = document.getElementById("qrOutput");
-
-    container.innerHTML = "";
-
-    if (value === "") {
-        alert("Please enter some text or URL");
-        return;
-    }
-
-    qrInstance = new QRCode(container, {
-        text: value,
-        width: 200,
-        height: 200
+    document.getElementById("qrInput").addEventListener("input", function () {
+        const value = document.getElementById("qrInput").value.trim();
+        document.getElementById("createBtn").disabled = value === "";
     });
 
-});
+    document.getElementById("createBtn").disabled = true;
 
+    document.getElementById("qrInput").focus();
 </script>
 
 </body>
-</html>```
-
-**Changes:**
-
-1. **Added `required` attribute**: Ensures that the user enters some input before clicking the Generate button.
-2. **Added `label` element**: Improves accessibility by providing a clear label for the input field.
-3. **Added `meta` tags**: Includes the viewport meta tag for responsive design and the character encoding meta tag for proper character rendering.
-
-Please note that these changes are just suggestions, and you may need to adapt them to your specific requirements.
+</html>
+```
\ No newline at end of file
