From 3e3e49f1b30f2650a2b4f4f848ee718fd6947074 Mon Sep 17 00:00:00 2001
From: Khaliun Baatarkhuu <khaliun13@hotmail.com>
Date: Tue, 27 Jan 2026 18:18:08 +0000
Subject: [PATCH] Add form elements for product selection

1: added name input with validation
2: added email input validation
3: added colour fieldset with three required options
4: added size fieldset with six required options
5: added submit button
6: added my name at the footer section
---
 Form-Controls/index.html | 81 +++++++++++++++++++++++++++++++++++++---
 1 file changed, 76 insertions(+), 5 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 65a866cdb..86e98dfb8 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -13,15 +13,86 @@ <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-->
+     <!-- 
+- Collect customer's validated full name
+- Collect customer's validated email address
+- Choose 1 of 3 colours
+- Choose 1 of 6 sizes
+- All fields required
+- Semantic HTML only
+-->
+
+
+          <!--Customer Name -->
+          <label for="name">Full Name</label>
+          <input
+            type="text"
+            id="name"
+            name="name"
+            minlength="2"
+            required
+          >
+
+          <!-- Customer Email -->
+          <label for ="email">Email Address</label>
+          <input
+            type="email"
+            id="email"
+            name="email"
+            required
+          >
+
+          <!-- Shirt Colour -->
+          <fieldset>
+            <legend>Choose a Colour</legend>
+
+            <label>
+            <input
+              type="radio"
+              name="colour"
+              value="red"
+              required> 
+              Red
+            </label>
+
+            <label>
+            <input
+              type="radio"
+              name="colour"
+              value="blue"
+              required>
+              Blue
+            </label>
+
+            <label>
+            <input
+              type="radio"
+              name="colour"
+              value="green"
+              required>
+              Green
+            </label>
+          </fieldset>
+
+          <!-- Shirt Size -->
+           <fieldset>
+            <legend>Choose a Size</legend>
+
+            <label><input type="radio" name="size" value="XS" required> XS</label>
+            <label><input type="radio" name="size" value="S" required> S</label>
+            <label><input type="radio" name="size" value="M" required> M</label>
+            <label><input type="radio" name="size" value="L" required> L</label>
+            <label><input type="radio" name="size" value="XL" required> XL</label>
+            <label><input type="radio" name="size" value="XXL" required> XXL</label>
+           </fieldset>
+            
+           <!-- Submit Button -->
+          <button type="submit">Submit</button>
       </form>
     </main>
     <footer>
       <!-- change to your name-->
-      <h2>By HOMEWORK SOLUTION</h2>
+      <h2>By Khaliun Baatarkhuu </h2>
     </footer>
   </body>
 </html>