From 627518f8608435cd231fdc2adfe10da17a5f4fb2 Mon Sep 17 00:00:00 2001
From: Abakar <abmhts@gmail.com>
Date: Tue, 8 Sep 2026 11:39:19 +0100
Subject: [PATCH 1/2] Wrote the requirements as comments and added the HTML
 structure for the Name and Email sections.

Added customer information form fields with validation requirements.
---
 Form-Controls/index.html | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 74b591ffc..0ba0efb1d 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -13,11 +13,16 @@ <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-->
-      </form>
+      <h2>Customer information</h2>
+        <!-- Customer name must contain at least two non-space characters.-->
+        <label for="name">Name:</label>
+        <input type="text" id="name" pattern=".*\S.*\S.*" required>      
+        <!-- Customer email must be valid and follow a consistent email address pattern.-->
+        <label for="email">Email:</label>
+        <input type="email" id="email" required>
+        <!-- Provide 3 T-shirt colour options.-->
+        <!-- Provide 6 size options: XS, S, M, L, XL, XXL-->
+        </form>
     </main>
     <footer>
       <!-- change to your name-->

From b82bdb5290d1ea95d4870c52987a3e95183ae752 Mon Sep 17 00:00:00 2001
From: Abakar <abmhts@gmail.com>
Date: Tue, 8 Sep 2026 13:39:26 +0100
Subject: [PATCH 2/2] Added T-shirt colour and size options, form validation,
 and submit button

---
 Form-Controls/index.html | 25 +++++++++++++++++++++++--
 1 file changed, 23 insertions(+), 2 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 0ba0efb1d..e02f64a61 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -16,17 +16,38 @@ <h1>Product Pick</h1>
       <h2>Customer information</h2>
         <!-- Customer name must contain at least two non-space characters.-->
         <label for="name">Name:</label>
-        <input type="text" id="name" pattern=".*\S.*\S.*" required>      
+        <input type="text" id="name" pattern=".*\S.*\S.*" required>   
+        <br><br>
         <!-- Customer email must be valid and follow a consistent email address pattern.-->
         <label for="email">Email:</label>
         <input type="email" id="email" required>
         <!-- Provide 3 T-shirt colour options.-->
+        <h2>T-Shirt Colour</h2>
+        <label for="colour">Choose colour:</label>
+        <select id="colour" name="colour" required>
+          <option value=""></option>
+          <option value="black">Black</option>
+          <option value="white">White</option>
+          <option value="pink">Pink</option>  
+        </select>
         <!-- Provide 6 size options: XS, S, M, L, XL, XXL-->
+        <h2>T-shirt size</h2>
+        <lable for="size">Choose size:</lable>
+        <select id="size" name="size" required>
+          <option value=""></option>
+          <option value="xs">XS</option>
+          <option value="s">S</option>
+          <option value="m">M</option>
+          <option value="l">L</option>
+          <option value="xl">XL</option>
+          <option value="xxl">XXL</option>
+        </select>  
+        <button type="submit">submit</button>  
         </form>
     </main>
     <footer>
       <!-- change to your name-->
-      <p>By HOMEWORK SOLUTION</p>
+      <p>By Abakar Souleyman</p>
     </footer>
   </body>
 </html>