From 8e42931dc8535c100c374b4909a1a06ccb5e71e0 Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 14:47:33 +0100
Subject: [PATCH 01/13] Changed "HOMEWORK SOLUTION" to my name

---
 Form-Controls/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 74b591ffc..2593f0256 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -21,7 +21,7 @@ <h1>Product Pick</h1>
     </main>
     <footer>
       <!-- change to your name-->
-      <p>By HOMEWORK SOLUTION</p>
+      <p>By Craig Stoddart</p>
     </footer>
   </body>
 </html>

From 4ea39056c912ffe85f8e9613b8640736e1161f46 Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 14:54:00 +0100
Subject: [PATCH 02/13] Added Requirements in comments

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

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 2593f0256..77b3c982b 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -17,6 +17,12 @@ <h1>Product Pick</h1>
         <!-- 
           try writing out the requirements first as comments
         this will also help you fill in your PR message later-->
+
+        <!-- REQUIREMENTS: 
+         1.Customer's name - ensure it contains at least two non-space characters.
+         2.Customer's email - Email must be valid and follow consistent pattern.
+         3.T-Shirt colours - Provide 3 options, ensure right option can be picked.
+         4.Provide size options -XS, S, M, L, XL, XXL-->
       </form>
     </main>
     <footer>

From 37ba83c12e15a87ce8645783f84fff9e7293b875 Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 15:07:33 +0100
Subject: [PATCH 03/13] Updated "Full Name" input to specify input type, id and
 name

---
 Form-Controls/index.html | 20 +++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 77b3c982b..a3ad1e987 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -13,16 +13,26 @@ <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-->
 
-        <!-- REQUIREMENTS: 
-         1.Customer's name - ensure it contains at least two non-space characters.
-         2.Customer's email - Email must be valid and follow consistent pattern.
-         3.T-Shirt colours - Provide 3 options, ensure right option can be picked.
-         4.Provide size options -XS, S, M, L, XL, XXL-->
+        <!-- REQUIREMENTS: -->
+         <!-- 1.Customer's name - ensure it contains at least two non-space characters. -->
+               <div>
+                  <p>
+                    <label>Full Name</label>
+                    <input name = "Full Name">
+                  </p>
+               </div>
+         <!-- 2.Customer's email - Email must be valid and follow consistent pattern. -->
+         <!-- 3.T-Shirt colours - Provide 3 options, ensure right option can be picked. -->
+         <!-- 4.Provide size options -XS, S, M, L, XL, XXL -->
+
+
       </form>
     </main>
     <footer>

From ae6e17389f07e8a32351de9bfe2c91c57111213d Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 15:31:48 +0100
Subject: [PATCH 04/13] Added Email label; added colons to label titles

---
 Form-Controls/index.html | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index a3ad1e987..7ec94aa4f 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -21,15 +21,22 @@ <h1>Product Pick</h1>
         this will also help you fill in your PR message later-->
 
         <!-- REQUIREMENTS: -->
-         <!-- 1.Customer's name - ensure it contains at least two non-space characters. -->
+        <!-- 1.Customer's name - ensure it contains at least two non-space characters. -->
                <div>
                   <p>
-                    <label>Full Name</label>
-                    <input name = "Full Name">
+                    <label>Full Name:</label>
+                    <input type = "text" id = "name" name = "Full Name">
                   </p>
                </div>
-         <!-- 2.Customer's email - Email must be valid and follow consistent pattern. -->
-         <!-- 3.T-Shirt colours - Provide 3 options, ensure right option can be picked. -->
+        <!-- 2.Customer's email - Email must be valid and follow consistent pattern. -->
+         <div>
+          <p>
+            <label>Email:</label>
+            <input type = "email" id = "mail" name = "User Email">
+          </p>
+         </div>
+          
+        <!-- 3.T-Shirt colours - Provide 3 options, ensure right option can be picked. -->
          <!-- 4.Provide size options -XS, S, M, L, XL, XXL -->
 
 

From a4dbbe16d49005d3eb677ffb9a2e35f883b8cff6 Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 15:32:39 +0100
Subject: [PATCH 05/13] Added template code for "T-Shirt Size" checkbox

---
 Form-Controls/index.html | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 7ec94aa4f..4e280bf40 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -38,6 +38,13 @@ <h1>Product Pick</h1>
           
         <!-- 3.T-Shirt colours - Provide 3 options, ensure right option can be picked. -->
          <!-- 4.Provide size options -XS, S, M, L, XL, XXL -->
+            <div>
+            <p>T-Shirt Size:</p>
+            <p>
+              <label>XS:</label>
+              <input type = "checkbox" id = "name" name = "XS">
+            </p>
+          </div>
 
 
       </form>

From 770726e440be27f2b6d5934f38fb60914d7adc6c Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 15:46:05 +0100
Subject: [PATCH 06/13] Changed "T-Shirt Size" checkbox-style button to
 radio-style button; added remaining sizes

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

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 4e280bf40..359414f71 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -41,8 +41,10 @@ <h1>Product Pick</h1>
             <div>
             <p>T-Shirt Size:</p>
             <p>
-              <label>XS:</label>
-              <input type = "checkbox" id = "name" name = "XS">
+             <label>XS:</label>
+              <input type = "radio" id = "XS" name = "Size">
+            <label>S:</label>
+              <input type = "radio" id = "S" name = "Size">
             </p>
           </div>
 

From 33d69103b2b39e4d1290a7d9b1d4c4d134a4d037 Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 16:18:22 +0100
Subject: [PATCH 07/13] Added "T-Shirt Colour" section

---
 Form-Controls/index.html | 40 ++++++++++++++++++++++++++++++++++++----
 1 file changed, 36 insertions(+), 4 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 359414f71..565800e03 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -12,6 +12,7 @@
       <h1>Product Pick</h1>
     </header>
     <main>
+      <h2> Verify your order and details below:</h2>
       <form>
    
         
@@ -25,7 +26,7 @@ <h1>Product Pick</h1>
                <div>
                   <p>
                     <label>Full Name:</label>
-                    <input type = "text" id = "name" name = "Full Name">
+                    <input type = "text" id = "name" name = "name">
                   </p>
                </div>
         <!-- 2.Customer's email - Email must be valid and follow consistent pattern. -->
@@ -37,17 +38,48 @@ <h1>Product Pick</h1>
          </div>
           
         <!-- 3.T-Shirt colours - Provide 3 options, ensure right option can be picked. -->
+         <div>
+          <p>
+            <label for="T-Shirt Colour"> T-Shirt Colour: </label>
+            <select name="T-Shirt Colour" id="T-Shirt Colour">
+              <option label="Red" value="Red"> Red </option>
+              
+              <option label="Blue" value="Blue"> Blue </option>
+
+              <option label="Yellow" value="Yellow"> Yellow </option>
+            </select>
+          </p>
+         </div>
+        
          <!-- 4.Provide size options -XS, S, M, L, XL, XXL -->
             <div>
             <p>T-Shirt Size:</p>
+            
             <p>
-             <label>XS:</label>
-              <input type = "radio" id = "XS" name = "Size">
+            <label>XS:</label>
+              <input type = "radio" id = "XS" name = "Size" value = "XS">
+
             <label>S:</label>
-              <input type = "radio" id = "S" name = "Size">
+              <input type = "radio" id = "S" name = "Size" value = "S">
+              
+            <label>M:</label>
+              <input type = "radio" id = "M" name = "Size" value = "M">
+
+            <label>L:</label>
+              <input type = "radio" id = "L" name = "Size" value = "L">
+            
+            <label>XL:</label>
+              <input type = "radio" id = "XL" name = "Size" value = "XL">
+            
+            <label>XXL:</label>
+              <input type = "radio" id = "XXL" name = "Size" value = "XXL">
             </p>
           </div>
 
+      <div>
+        <button type="submit">Submit</button>
+      </div>
+
 
       </form>
     </main>

From 53f09890cebf41647b33b15de1a8544b52ce826b Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 16:52:10 +0100
Subject: [PATCH 08/13] Cleaned up Comments for readability

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

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 565800e03..49b6a5836 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -42,6 +42,8 @@ <h2> Verify your order and details below:</h2>
           <p>
             <label for="T-Shirt Colour"> T-Shirt Colour: </label>
             <select name="T-Shirt Colour" id="T-Shirt Colour">
+              <option selected disabled> Choose colour:</option>
+              
               <option label="Red" value="Red"> Red </option>
               
               <option label="Blue" value="Blue"> Blue </option>

From 0728ba13c25525a571e20fb9ef28baebfd230579 Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 17:08:05 +0100
Subject: [PATCH 09/13] Added basic style sheet with text formatting

---
 Form-Controls/index.html  | 15 ++++++---------
 Form-Controls/mystyle.css | 13 +++++++++++++
 2 files changed, 19 insertions(+), 9 deletions(-)
 create mode 100644 Form-Controls/mystyle.css

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 49b6a5836..583b93749 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -6,6 +6,8 @@
     <title>My form exercise</title>
     <meta name="description" content="" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
+
+    <link rel="Stylesheet" href="Mystyle.css" />
   </head>
   <body>
     <header>
@@ -14,14 +16,9 @@ <h1>Product Pick</h1>
     <main>
       <h2> Verify your order and details below:</h2>
       <form>
-   
-        
-        <!-- write your html here-->
-        <!-- 
-          try writing out the requirements first as comments
-        this will also help you fill in your PR message later-->
 
-        <!-- REQUIREMENTS: -->
+        <!-- REQUIREMENTS:
+         Each requirement is listed as a comment with the corresponding code below it-->
         <!-- 1.Customer's name - ensure it contains at least two non-space characters. -->
                <div>
                   <p>
@@ -29,6 +26,7 @@ <h2> Verify your order and details below:</h2>
                     <input type = "text" id = "name" name = "name">
                   </p>
                </div>
+
         <!-- 2.Customer's email - Email must be valid and follow consistent pattern. -->
          <div>
           <p>
@@ -42,8 +40,7 @@ <h2> Verify your order and details below:</h2>
           <p>
             <label for="T-Shirt Colour"> T-Shirt Colour: </label>
             <select name="T-Shirt Colour" id="T-Shirt Colour">
-              <option selected disabled> Choose colour:</option>
-              
+              <option selected disabled > Select a colour </option>
               <option label="Red" value="Red"> Red </option>
               
               <option label="Blue" value="Blue"> Blue </option>
diff --git a/Form-Controls/mystyle.css b/Form-Controls/mystyle.css
new file mode 100644
index 000000000..766af25a0
--- /dev/null
+++ b/Form-Controls/mystyle.css
@@ -0,0 +1,13 @@
+/* Form Styling */
+
+
+/* Text Formatting */
+/* Headers */
+h1, h2 {font-family: Tahoma;}
+
+h2 {font-weight: lighter;}
+
+/* Paragraph */
+
+p {font-family: verdana;
+font-size: 90%;}
\ No newline at end of file

From 8576e9d7e7f1b7697d943a0a09dea00566004e8e Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 17:31:24 +0100
Subject: [PATCH 10/13] Added Grid Container

---
 Form-Controls/index.html  | 14 +++++++++++---
 Form-Controls/mystyle.css |  9 ++++++++-
 2 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 583b93749..977ee36e9 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -19,6 +19,9 @@ <h2> Verify your order and details below:</h2>
 
         <!-- REQUIREMENTS:
          Each requirement is listed as a comment with the corresponding code below it-->
+
+         <div class="grid-container">
+
         <!-- 1.Customer's name - ensure it contains at least two non-space characters. -->
                <div>
                   <p>
@@ -40,7 +43,9 @@ <h2> Verify your order and details below:</h2>
           <p>
             <label for="T-Shirt Colour"> T-Shirt Colour: </label>
             <select name="T-Shirt Colour" id="T-Shirt Colour">
+
               <option selected disabled > Select a colour </option>
+
               <option label="Red" value="Red"> Red </option>
               
               <option label="Blue" value="Blue"> Blue </option>
@@ -52,9 +57,9 @@ <h2> Verify your order and details below:</h2>
         
          <!-- 4.Provide size options -XS, S, M, L, XL, XXL -->
             <div>
-            <p>T-Shirt Size:</p>
-            
-            <p>
+              <p>T-Shirt Size:</p>
+
+             <p>
             <label>XS:</label>
               <input type = "radio" id = "XS" name = "Size" value = "XS">
 
@@ -74,6 +79,9 @@ <h2> Verify your order and details below:</h2>
               <input type = "radio" id = "XXL" name = "Size" value = "XXL">
             </p>
           </div>
+        </div>
+
+      <br>
 
       <div>
         <button type="submit">Submit</button>
diff --git a/Form-Controls/mystyle.css b/Form-Controls/mystyle.css
index 766af25a0..d3a4a733a 100644
--- a/Form-Controls/mystyle.css
+++ b/Form-Controls/mystyle.css
@@ -10,4 +10,11 @@ h2 {font-weight: lighter;}
 /* Paragraph */
 
 p {font-family: verdana;
-font-size: 90%;}
\ No newline at end of file
+font-size: 90%;}
+
+.grid-container {border-style: solid;
+    border-width: 1px;
+    padding: 5px;
+max-width:min-content;}
+
+.column {align-content: center;}
\ No newline at end of file

From 15bf3aff68e9521b5b97d47f324f92e9a29bfc50 Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 18:00:08 +0100
Subject: [PATCH 11/13] Changed container type; changed h1 to "T-Shirt Order"

---
 Form-Controls/index.html  | 5 +++--
 Form-Controls/mystyle.css | 8 +++-----
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 977ee36e9..584f93af3 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -11,7 +11,7 @@
   </head>
   <body>
     <header>
-      <h1>Product Pick</h1>
+      <h1>T-Shirt Order</h1>
     </header>
     <main>
       <h2> Verify your order and details below:</h2>
@@ -20,7 +20,7 @@ <h2> Verify your order and details below:</h2>
         <!-- REQUIREMENTS:
          Each requirement is listed as a comment with the corresponding code below it-->
 
-         <div class="grid-container">
+         <div class="container">
 
         <!-- 1.Customer's name - ensure it contains at least two non-space characters. -->
                <div>
@@ -80,6 +80,7 @@ <h2> Verify your order and details below:</h2>
             </p>
           </div>
         </div>
+      </div>
 
       <br>
 
diff --git a/Form-Controls/mystyle.css b/Form-Controls/mystyle.css
index d3a4a733a..cc93814a9 100644
--- a/Form-Controls/mystyle.css
+++ b/Form-Controls/mystyle.css
@@ -1,5 +1,5 @@
 /* Form Styling */
-
+ 
 
 /* Text Formatting */
 /* Headers */
@@ -12,9 +12,7 @@ h2 {font-weight: lighter;}
 p {font-family: verdana;
 font-size: 90%;}
 
-.grid-container {border-style: solid;
+.container {border-style: solid;
     border-width: 1px;
     padding: 5px;
-max-width:min-content;}
-
-.column {align-content: center;}
\ No newline at end of file
+    max-width:350px;}

From a851094e12af6272896b89bb71410cde8a95bbb1 Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 18:04:41 +0100
Subject: [PATCH 12/13] Removed whitespace from T-Shirt Colour"; removed stray
 div tag

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

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 584f93af3..545a66a2b 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -41,8 +41,8 @@ <h2> Verify your order and details below:</h2>
         <!-- 3.T-Shirt colours - Provide 3 options, ensure right option can be picked. -->
          <div>
           <p>
-            <label for="T-Shirt Colour"> T-Shirt Colour: </label>
-            <select name="T-Shirt Colour" id="T-Shirt Colour">
+            <label for="T-Shirt-Colour"> T-Shirt Colour: </label>
+            <select name="T-Shirt-Colour" id="T-Shirt-Colour">
 
               <option selected disabled > Select a colour </option>
 
@@ -80,7 +80,6 @@ <h2> Verify your order and details below:</h2>
             </p>
           </div>
         </div>
-      </div>
 
       <br>
 

From efae5ad79a01e493518732d52def35acbfd36222 Mon Sep 17 00:00:00 2001
From: Craig Stodd <craigstodd95@gmail.com>
Date: Tue, 12 May 2026 18:23:16 +0100
Subject: [PATCH 13/13] Fixed Label end tags

---
 Form-Controls/index.html  | 24 ++++++++++++++++--------
 Form-Controls/mystyle.css |  2 --
 2 files changed, 16 insertions(+), 10 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 545a66a2b..80d9de5d0 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -25,16 +25,18 @@ <h2> Verify your order and details below:</h2>
         <!-- 1.Customer's name - ensure it contains at least two non-space characters. -->
                <div>
                   <p>
-                    <label>Full Name:</label>
+                    <label>Full Name:
                     <input type = "text" id = "name" name = "name">
+                    </label>
                   </p>
                </div>
 
         <!-- 2.Customer's email - Email must be valid and follow consistent pattern. -->
          <div>
           <p>
-            <label>Email:</label>
+            <label>Email:
             <input type = "email" id = "mail" name = "User Email">
+            </label>
           </p>
          </div>
           
@@ -60,23 +62,29 @@ <h2> Verify your order and details below:</h2>
               <p>T-Shirt Size:</p>
 
              <p>
-            <label>XS:</label>
+            <label>XS:
               <input type = "radio" id = "XS" name = "Size" value = "XS">
+              </label>
 
-            <label>S:</label>
+            <label>S:
               <input type = "radio" id = "S" name = "Size" value = "S">
+              </label>
               
-            <label>M:</label>
+            <label>M:
               <input type = "radio" id = "M" name = "Size" value = "M">
+              </label>
 
-            <label>L:</label>
+            <label>L:
               <input type = "radio" id = "L" name = "Size" value = "L">
+              </label>
             
-            <label>XL:</label>
+            <label>XL:
               <input type = "radio" id = "XL" name = "Size" value = "XL">
+              </label>
             
-            <label>XXL:</label>
+            <label>XXL:
               <input type = "radio" id = "XXL" name = "Size" value = "XXL">
+              </label>
             </p>
           </div>
         </div>
diff --git a/Form-Controls/mystyle.css b/Form-Controls/mystyle.css
index cc93814a9..3301cb644 100644
--- a/Form-Controls/mystyle.css
+++ b/Form-Controls/mystyle.css
@@ -1,6 +1,4 @@
 /* Form Styling */
- 
-
 /* Text Formatting */
 /* Headers */
 h1, h2 {font-family: Tahoma;}