From e06d2495f24224c78b616c70efcdaf7d1b832565 Mon Sep 17 00:00:00 2001
From: Khlil1313 <90422263+Khlil1313@users.noreply.github.com>
Date: Fri, 5 May 2023 21:32:25 +0100
Subject: [PATCH 1/2] creating the form-controls

---
 Form-Controls/index.html | 35 +++++++++++++++++++++++++++++++++--
 Form-Controls/styles.css |  3 +++
 2 files changed, 36 insertions(+), 2 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 4344b144..e4dae7f0 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -13,15 +13,46 @@
     <h1>Product Pick</h1>
   </header>
   <main>
-  <form>
+  <form id="TShirtForm" class="contianer">
     <!-- write your html here-->
     <!-- try writing out the requirements first-->
+    <label for="firstName">First Name</label>
+    <input type="text" id="firstName" placeholder="Full name" required>
+    <label for="lastName">Last Name</label>
+    <input type="text" id="lastName" placeholder="Last name" required><br><br>
+    <label for="email">Email address</label>
+    <input type="email" id="email" placeholder="Insert your email address" required><br><br>
+    
+    <label for="deliveryDate">Select the delivery date</label>
+    <input type="date" id="deliveryDate" min="5/5/2023" max="5/6/2023" required> 
+
+    <label for="colors">Select your colour</label>
+    <select id="colors" form="TShirtForm">
+      <option value="green">Green</option>
+      <option value="black">Black</option>
+      <option value="red">Red</option>
+    </select>
+    
+    <label for="size">Select your size</label>
+    <select id="size" form="TShirtForm">
+      <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><br><br>
+
+    <input type="submit">
+
   </form>
+  
 
   </main>
   <footer>
     <!-- change to your name-->
-    <h2>By HOMEWORK SOLUTION</h2>
+    <h2>By Khalil Alhaydr</h2>
   </footer>
 </body>
 
diff --git a/Form-Controls/styles.css b/Form-Controls/styles.css
index e69de29b..bde7b572 100644
--- a/Form-Controls/styles.css
+++ b/Form-Controls/styles.css
@@ -0,0 +1,3 @@
+* {
+    background-color: rgb(212, 210, 210);
+}
\ No newline at end of file

From dbe3a9c9f76b9f910dced47adf3b1562a3259204 Mon Sep 17 00:00:00 2001
From: Khlil1313 <90422263+Khlil1313@users.noreply.github.com>
Date: Fri, 5 May 2023 22:00:46 +0100
Subject: [PATCH 2/2] update the css file

---
 Form-Controls/index.html |  8 ++++----
 Form-Controls/styles.css | 20 +++++++++++++++++++-
 2 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index e4dae7f0..c345a285 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -17,21 +17,21 @@ <h1>Product Pick</h1>
     <!-- write your html here-->
     <!-- try writing out the requirements first-->
     <label for="firstName">First Name</label>
-    <input type="text" id="firstName" placeholder="Full name" required>
+    <input type="text" id="firstName" placeholder="First name" required><br><br>
     <label for="lastName">Last Name</label>
     <input type="text" id="lastName" placeholder="Last name" required><br><br>
     <label for="email">Email address</label>
     <input type="email" id="email" placeholder="Insert your email address" required><br><br>
     
     <label for="deliveryDate">Select the delivery date</label>
-    <input type="date" id="deliveryDate" min="5/5/2023" max="5/6/2023" required> 
+    <input type="date" id="deliveryDate" min="5/5/2023" max="5/6/2023" required><br><br>
 
     <label for="colors">Select your colour</label>
     <select id="colors" form="TShirtForm">
       <option value="green">Green</option>
       <option value="black">Black</option>
       <option value="red">Red</option>
-    </select>
+    </select><br><br>
     
     <label for="size">Select your size</label>
     <select id="size" form="TShirtForm">
@@ -44,7 +44,7 @@ <h1>Product Pick</h1>
     
     </select><br><br>
 
-    <input type="submit">
+    <input type="submit" id="submit">
 
   </form>
   
diff --git a/Form-Controls/styles.css b/Form-Controls/styles.css
index bde7b572..beb529e1 100644
--- a/Form-Controls/styles.css
+++ b/Form-Controls/styles.css
@@ -1,3 +1,21 @@
 * {
-    background-color: rgb(212, 210, 210);
+    background-color: rgb(247, 244, 244);
+}
+#submit {
+    background-color: green;
+    color: white;
+    padding: 12px 20px;
+    border: none;
+    border-radius: 4px;
+    cursor: pointer;
+}
+input[type=text], input[type=email], input[type=date], select, textarea {
+    width: 25%;
+    padding: 12px;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    box-sizing: border-box;
+    margin-top: 6px;
+    margin-bottom: 16px;
+    resize: vertical
 }
\ No newline at end of file