From bf89c2ba50facf809e49e913c8043b0f1ea477b6 Mon Sep 17 00:00:00 2001
From: hackertainment <259196870+hackertainment@users.noreply.github.com>
Date: Fri, 24 Jul 2026 02:28:22 +0800
Subject: [PATCH 1/8] Update index.html

writing out the requirements as comments
---
 Form-Controls/index.html | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 74b591ffc..7d6e5fb99 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -14,6 +14,12 @@ <h1>Product Pick</h1>
     <main>
       <form>
         <!-- write your html here-->
+        <form>
+        <!-- What is the customer's name? I must collect this data and ensure it contains at least two non-space characters. -->
+        <!-- What is the customer's email? I must make sure the email is valid. Email addresses follow a consistent pattern. -->
+        <!-- What colour should this T-shirt be? I must provide 3 options. How will I ensure they do not choose other colours? -->
+        <!-- What size does the customer want? I must provide the following 6 options: XS, S, M, L, XL, XXL -->
+        </form>
         <!-- 
           try writing out the requirements first as comments
         this will also help you fill in your PR message later-->

From 0f84df0f81048db75406d5b76992ca77136d2229 Mon Sep 17 00:00:00 2001
From: hackertainment <259196870+hackertainment@users.noreply.github.com>
Date: Fri, 24 Jul 2026 02:48:37 +0800
Subject: [PATCH 2/8] Update index.html

collect the customer's name and ensure it contains at least two non-space characters
---
 Form-Controls/index.html | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 7d6e5fb99..9fbea0955 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -14,12 +14,15 @@ <h1>Product Pick</h1>
     <main>
       <form>
         <!-- write your html here-->
-        <form>
         <!-- What is the customer's name? I must collect this data and ensure it contains at least two non-space characters. -->
+        <div>
+          <label>
+            Name: <input type="text" id="name" name="name" placeholder="Forename Surname" pattern=".*\S.*\S.*" required />
+          </label>          
+        </div>
         <!-- What is the customer's email? I must make sure the email is valid. Email addresses follow a consistent pattern. -->
         <!-- What colour should this T-shirt be? I must provide 3 options. How will I ensure they do not choose other colours? -->
         <!-- What size does the customer want? I must provide the following 6 options: XS, S, M, L, XL, XXL -->
-        </form>
         <!-- 
           try writing out the requirements first as comments
         this will also help you fill in your PR message later-->

From 3a6b2fb4821a2ae530c6ba074d347a422cf13397 Mon Sep 17 00:00:00 2001
From: hackertainment <259196870+hackertainment@users.noreply.github.com>
Date: Fri, 24 Jul 2026 02:58:32 +0800
Subject: [PATCH 3/8] Update index.html

collect the customer's email and make sure the email is valid
---
 Form-Controls/index.html | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 9fbea0955..209f5ffe3 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -17,10 +17,15 @@ <h1>Product Pick</h1>
         <!-- What is the customer's name? I must collect this data and ensure it contains at least two non-space characters. -->
         <div>
           <label>
-            Name: <input type="text" id="name" name="name" placeholder="Forename Surname" pattern=".*\S.*\S.*" required />
+            Name: <input type="text" id="name" name="name" placeholder="Forename Surname" pattern="\S.*\S" required />
           </label>          
         </div>
         <!-- What is the customer's email? I must make sure the email is valid. Email addresses follow a consistent pattern. -->
+        <div>
+          <label>
+            Email: <input type="email" id="email" name="email" required />
+          </label>
+        </div>
         <!-- What colour should this T-shirt be? I must provide 3 options. How will I ensure they do not choose other colours? -->
         <!-- What size does the customer want? I must provide the following 6 options: XS, S, M, L, XL, XXL -->
         <!-- 

From 5d2ebd8f3627354bd84c03cc509ece6d456f1005 Mon Sep 17 00:00:00 2001
From: hackertainment <259196870+hackertainment@users.noreply.github.com>
Date: Fri, 24 Jul 2026 03:22:04 +0800
Subject: [PATCH 4/8] Update index.html

collect the T-shirt's colour and T-shirt provide 3 options
---
 Form-Controls/index.html | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 209f5ffe3..fae553ded 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -27,6 +27,14 @@ <h1>Product Pick</h1>
           </label>
         </div>
         <!-- What colour should this T-shirt be? I must provide 3 options. How will I ensure they do not choose other colours? -->
+        <div>
+          Colour:
+          <label>
+            <input type="radio" id="colour_r" name="colour" value="R" /><span style="background-color:#FFBBBB;">Red</span>&nbsp;
+            <input type="radio" id="colour_g" name="colour" value="G" /><span style="background-color:#BBFFBB;">Green</span>&nbsp;
+            <input type="radio" id="colour_b" name="colour" value="B" /><span style="background-color:#BBBBFF;">Blue</span>&nbsp;
+          </label>
+        </div>
         <!-- What size does the customer want? I must provide the following 6 options: XS, S, M, L, XL, XXL -->
         <!-- 
           try writing out the requirements first as comments

From 12eac981bc99fa48a04036ad3f99d21c2fef803d Mon Sep 17 00:00:00 2001
From: hackertainment <259196870+hackertainment@users.noreply.github.com>
Date: Fri, 24 Jul 2026 03:32:09 +0800
Subject: [PATCH 5/8] Update index.html

collect T-shirt's size size and provide 6 options
---
 Form-Controls/index.html | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index fae553ded..9fc6d8df2 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -31,11 +31,27 @@ <h1>Product Pick</h1>
           Colour:
           <label>
             <input type="radio" id="colour_r" name="colour" value="R" /><span style="background-color:#FFBBBB;">Red</span>&nbsp;
+          </label>
+          <label>
             <input type="radio" id="colour_g" name="colour" value="G" /><span style="background-color:#BBFFBB;">Green</span>&nbsp;
+          </label>
+          <label>
             <input type="radio" id="colour_b" name="colour" value="B" /><span style="background-color:#BBBBFF;">Blue</span>&nbsp;
           </label>
         </div>
         <!-- What size does the customer want? I must provide the following 6 options: XS, S, M, L, XL, XXL -->
+        <div>
+          <label>
+            Size: <select id="size" name="size">
+              <option value="XS">XS</option>
+              <option value="S">S</option>
+              <option value="M" selected>M</option>
+              <option value="L">L</option>
+              <option value="XL">XL</option>
+              <option value="XXL">XXL</option>
+            </select>
+          </label>
+        </div>
         <!-- 
           try writing out the requirements first as comments
         this will also help you fill in your PR message later-->

From 2e3ede589bd41bac8540823a7b1bfdc4d205672a Mon Sep 17 00:00:00 2001
From: hackertainment <259196870+hackertainment@users.noreply.github.com>
Date: Fri, 24 Jul 2026 03:47:17 +0800
Subject: [PATCH 6/8] Update index.html

finalise form controls
---
 Form-Controls/index.html | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 9fc6d8df2..164be9025 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -30,13 +30,13 @@ <h1>Product Pick</h1>
         <div>
           Colour:
           <label>
-            <input type="radio" id="colour_r" name="colour" value="R" /><span style="background-color:#FFBBBB;">Red</span>&nbsp;
+            <input type="radio" id="colour_r" name="colour" value="R" required /><span style="background-color:#FFBBBB;">Red</span>&nbsp;
           </label>
           <label>
-            <input type="radio" id="colour_g" name="colour" value="G" /><span style="background-color:#BBFFBB;">Green</span>&nbsp;
+            <input type="radio" id="colour_g" name="colour" value="G" required /><span style="background-color:#BBFFBB;">Green</span>&nbsp;
           </label>
           <label>
-            <input type="radio" id="colour_b" name="colour" value="B" /><span style="background-color:#BBBBFF;">Blue</span>&nbsp;
+            <input type="radio" id="colour_b" name="colour" value="B" required /><span style="background-color:#BBBBFF;">Blue</span>&nbsp;
           </label>
         </div>
         <!-- What size does the customer want? I must provide the following 6 options: XS, S, M, L, XL, XXL -->
@@ -55,11 +55,13 @@ <h1>Product Pick</h1>
         <!-- 
           try writing out the requirements first as comments
         this will also help you fill in your PR message later-->
+        <button type="reset">Reset</button>
+        <button type="submit">Submit</button>
       </form>
     </main>
     <footer>
       <!-- change to your name-->
-      <p>By HOMEWORK SOLUTION</p>
+      <p>By WYATT LEE</p>
     </footer>
   </body>
 </html>

From 598683205bd95dda659af272f9b73112dcc8cdfa Mon Sep 17 00:00:00 2001
From: hackertainment <259196870+hackertainment@users.noreply.github.com>
Date: Fri, 24 Jul 2026 03:55:52 +0800
Subject: [PATCH 7/8] Update index.html

fix colours
---
 Form-Controls/index.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 164be9025..caadc234f 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -30,13 +30,13 @@ <h1>Product Pick</h1>
         <div>
           Colour:
           <label>
-            <input type="radio" id="colour_r" name="colour" value="R" required /><span style="background-color:#FFBBBB;">Red</span>&nbsp;
+            <input type="radio" id="colour_r" name="colour" value="R" required /><span style="background-color:#FFBBBB;">red</span>&nbsp;
           </label>
           <label>
-            <input type="radio" id="colour_g" name="colour" value="G" required /><span style="background-color:#BBFFBB;">Green</span>&nbsp;
+            <input type="radio" id="colour_g" name="colour" value="G" required /><span style="background-color:#BBFFBB;">green</span>&nbsp;
           </label>
           <label>
-            <input type="radio" id="colour_b" name="colour" value="B" required /><span style="background-color:#BBBBFF;">Blue</span>&nbsp;
+            <input type="radio" id="colour_b" name="colour" value="B" required /><span style="background-color:#BBBBFF;">blue</span>&nbsp;
           </label>
         </div>
         <!-- What size does the customer want? I must provide the following 6 options: XS, S, M, L, XL, XXL -->

From 4e6dd987461c08a133b0ebbd9d9d6d7c1c30fb95 Mon Sep 17 00:00:00 2001
From: hackertainment <259196870+hackertainment@users.noreply.github.com>
Date: Fri, 24 Jul 2026 03:58:48 +0800
Subject: [PATCH 8/8] Update index.html

fix colours
---
 Form-Controls/index.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index caadc234f..5ab24b805 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -30,13 +30,13 @@ <h1>Product Pick</h1>
         <div>
           Colour:
           <label>
-            <input type="radio" id="colour_r" name="colour" value="R" required /><span style="background-color:#FFBBBB;">red</span>&nbsp;
+            <input type="radio" id="colour_r" name="colour" value="R" required /><span style="background-color:#FFBBBB;">&nbsp;red&nbsp;</span>&nbsp;
           </label>
           <label>
-            <input type="radio" id="colour_g" name="colour" value="G" required /><span style="background-color:#BBFFBB;">green</span>&nbsp;
+            <input type="radio" id="colour_g" name="colour" value="G" required /><span style="background-color:#BBFFBB;">&nbsp;green&nbsp;</span>&nbsp;
           </label>
           <label>
-            <input type="radio" id="colour_b" name="colour" value="B" required /><span style="background-color:#BBBBFF;">blue</span>&nbsp;
+            <input type="radio" id="colour_b" name="colour" value="B" required /><span style="background-color:#BBBBFF;">&nbsp;blue&nbsp;</span>&nbsp;
           </label>
         </div>
         <!-- What size does the customer want? I must provide the following 6 options: XS, S, M, L, XL, XXL -->