From 330bb20cc4d9bd64f9240132022add53f05dc91f Mon Sep 17 00:00:00 2001
From: joanne342 <130585013+joanne342@users.noreply.github.com>
Date: Mon, 5 Jan 2026 12:09:34 +0000
Subject: [PATCH 1/2] Update index.html

---
 Form-Controls/index.html | 70 ++++++++++++++++++++++++++++++++++++----
 1 file changed, 64 insertions(+), 6 deletions(-)
diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 65a866cdb..0d9b1c620 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -13,15 +13,73 @@ <h1>Product Pick</h1>
     </header>
     <main>
       <form>
-        <!-- write your html here-->
-        <!-- 
-          try writing out the requirements first as comments
-        this will also help you fill in your PR message later-->
+
+        <!-- Personal Info -->
+        <fieldset>
+          <legend>Personal Info</legend>
+
+          <div>
+            <label for="name">Name:</label>
+            <input type="text" name="name" id="name" required minlength="2">
+          </div>
+
+          <div>
+            <label for="email">Email:</label>
+            <input type="email" name="email" id="email" required>
+          </div>
+        </fieldset>
+
+        <!-- Colour Selection -->
+        <fieldset>
+          <legend>Choose a Colour</legend>
+
+          <label>
+            <input type="radio" name="colour" id="red" value="red" required> Red
+          </label>
+          <label>
+            <input type="radio" name="colour" id="green" value="green"> Green
+          </label>
+          <label>
+            <input type="radio" name="colour" id="blue" value="blue"> Blue
+          </label>
+
+        </fieldset>
+
+        <!-- Size Selection -->
+        <fieldset>
+          <legend>Choose a Size</legend>
+
+          <label>
+            <input type="radio" name="size" id="xs" value="xs" required> XS
+          </label>
+          <label>
+            <input type="radio" name="size" id="s" value="s"> S
+          </label>
+          <label>
+            <input type="radio" name="size" id="m" value="m"> M
+          </label>
+          <label>
+            <input type="radio" name="size" id="l" value="l"> L
+          </label>
+          <label>
+            <input type="radio" name="size" id="xl" value="xl"> XL
+          </label>
+          <label>
+            <input type="radio" name="size" id="xxl" value="xxl"> XXL
+          </label>
+
+        </fieldset>
+
+        <!-- Buttons -->
+        <div>
+          <button type="reset">Reset</button>
+          <button type="submit">Submit</button>
+        </div>
+
       </form>
     </main>
     <footer>
-      <!-- change to your name-->
-      <h2>By HOMEWORK SOLUTION</h2>
+      <h2>By Joanne O'Malley</h2>
     </footer>
   </body>
 </html>

From e8865f748ff7fd53bc1743fa89038942f1017583 Mon Sep 17 00:00:00 2001
From: joanne342 <130585013+joanne342@users.noreply.github.com>
Date: Sat, 2 May 2026 21:10:19 +0100
Subject: [PATCH 2/2] Update index.html

More space to improve Lighthouse score
---
 Form-Controls/index.html | 109 ++++++++++++++++++++++++++-------------
 1 file changed, 73 insertions(+), 36 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 0d9b1c620..f9791d486 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -4,13 +4,15 @@
     <meta charset="utf-8" />
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <title>My form exercise</title>
-    <meta name="description" content="" />
+    <meta name="description" content="Product pick" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
   </head>
+
   <body>
     <header>
       <h1>Product Pick</h1>
     </header>
+
     <main>
       <form>
 
@@ -18,30 +20,41 @@ <h1>Product Pick</h1>
         <fieldset>
           <legend>Personal Info</legend>
 
-          <div>
-            <label for="name">Name:</label>
+          <p>
+            <label for="name">Name:</label><br>
             <input type="text" name="name" id="name" required minlength="2">
-          </div>
+          </p>
 
-          <div>
-            <label for="email">Email:</label>
+          <p>
+            <label for="email">Email:</label><br>
             <input type="email" name="email" id="email" required>
-          </div>
+          </p>
         </fieldset>
 
         <!-- Colour Selection -->
         <fieldset>
           <legend>Choose a Colour</legend>
 
-          <label>
-            <input type="radio" name="colour" id="red" value="red" required> Red
-          </label>
-          <label>
-            <input type="radio" name="colour" id="green" value="green"> Green
-          </label>
-          <label>
-            <input type="radio" name="colour" id="blue" value="blue"> Blue
-          </label>
+          <p>
+            <label for="red">
+              <input type="radio" name="colour" id="red" value="red" required>
+              Red
+            </label>
+          </p>
+
+          <p>
+            <label for="green">
+              <input type="radio" name="colour" id="green" value="green">
+              Green
+            </label>
+          </p>
+
+          <p>
+            <label for="blue">
+              <input type="radio" name="colour" id="blue" value="blue">
+              Blue
+            </label>
+          </p>
 
         </fieldset>
 
@@ -49,35 +62,59 @@ <h1>Product Pick</h1>
         <fieldset>
           <legend>Choose a Size</legend>
 
-          <label>
-            <input type="radio" name="size" id="xs" value="xs" required> XS
-          </label>
-          <label>
-            <input type="radio" name="size" id="s" value="s"> S
-          </label>
-          <label>
-            <input type="radio" name="size" id="m" value="m"> M
-          </label>
-          <label>
-            <input type="radio" name="size" id="l" value="l"> L
-          </label>
-          <label>
-            <input type="radio" name="size" id="xl" value="xl"> XL
-          </label>
-          <label>
-            <input type="radio" name="size" id="xxl" value="xxl"> XXL
-          </label>
+          <p>
+            <label for="xs">
+              <input type="radio" name="size" id="xs" value="xs" required>
+              XS
+            </label>
+          </p>
+
+          <p>
+            <label for="s">
+              <input type="radio" name="size" id="s" value="s">
+              S
+            </label>
+          </p>
+
+          <p>
+            <label for="m">
+              <input type="radio" name="size" id="m" value="m">
+              M
+            </label>
+          </p>
+
+          <p>
+            <label for="l">
+              <input type="radio" name="size" id="l" value="l">
+              L
+            </label>
+          </p>
+
+          <p>
+            <label for="xl">
+              <input type="radio" name="size" id="xl" value="xl">
+              XL
+            </label>
+          </p>
+
+          <p>
+            <label for="xxl">
+              <input type="radio" name="size" id="xxl" value="xxl">
+              XXL
+            </label>
+          </p>
 
         </fieldset>
 
         <!-- Buttons -->
-        <div>
+        <p>
           <button type="reset">Reset</button>
           <button type="submit">Submit</button>
-        </div>
+        </p>
 
       </form>
     </main>
+
     <footer>
       <h2>By Joanne O'Malley</h2>
     </footer>
