Merge pull request #27 from Light13008/main

Order page was made user friendly.
Open-Source-Chandigarh · Oct 26, 2023 · 12de5dd · 12de5dd
2 parents d572dfa + 8de4402
commit 12de5dd
Show file tree

Hide file tree

Showing 2 changed files with 79 additions and 32 deletions.
diff --git a/order.css b/order.css
@@ -1,27 +1,35 @@
 h2{
     text-align: center;
-    background-color: black;
+    background-color: rgb(85, 54, 0);
     color: white;
     padding: 20px;
     margin-top: 10px;
     font-family:fantasy;
-    width: 100%;
+    width: 90%;
     margin-bottom: 1%;
+    opacity: 1;
+    padding: 20px;
+    margin-left:70px;
+    border-radius: 25px;
+
 }
 
-.row{
+row{
     width: 100%;
     margin: 0px;
-}
+} 
 
 form{
     padding: 20px;
     color: white;
+    width: 98%;
+
 }
 
 li span{
     color: black !important;
     background-color: rgb(255, 196, 0);
+
 }
 
 body{
@@ -55,6 +63,7 @@ body{
     background-color: #ecd448;
     font-weight: bolder;
     box-shadow: 0 2px 0 2px #000;
+    margin-top: 20px;
 }
 
 .btn:before {
@@ -96,4 +105,9 @@ body{
 }
 .hide_as_link :active {
     color: #000000;
+}
+
+
+#inputAddress, #inputAddress2{
+    width: 55%;
 }
diff --git a/order.html b/order.html
@@ -78,39 +78,72 @@ <h2> Step 1 - My Awesome Cart Express Checkout - Review Your Cart items </h2>
           		    </div>	       	   
         </a>
   </div>
-  <div class="col my-4">
-    <h2> Step 2 - Enter Address & Other Details</h2>
-    <form class="row g-3">
-      <div class="col-md-6">
-        <label for="inputEmail4" class="form-label">Name</label>
-        <input type="text" class="form-control" id="inputEmail4" required>
-      </div>
-      <div class="col-md-6">
-        <label for="inputphone" class="form-label">Number</label>
-        <input type="tel" class="form-control" id="inputPassword4" maxlength="10" required>
-      </div>
-      <div class="col-12">
-        <label for="inputAddress" class="form-label">Email Address</label>
-        <input type="text" class="form-control" id="inputAddress" placeholder="1234 Main St" required>
-      </div>
-      <div class="col-12">
-        <label for="inputAddress2" class="form-label">Address</label>
-        <input type="text" class="form-control" id="inputAddress2" placeholder="Apartment, studio, or floor" required>
-      </div>
-      <div class="col-md-6">
-        <label for="inputCity" class="form-label">City</label>
-        <input type="text" class="form-control" id="inputCity" required>
-      </div>
-      <div class="col-md-4">
-        <label for="inputState" class="form-label">State</label>
-        <select id="inputState" class="form-select" required>
-          <option selected>Choose...</option>
-          <option>...</option>
+    <div class="col my-4">
+      <h2> Step 2 - Enter Address & Other Details</h2>
+      <form class="row g-3">
+        <div class="col-md-6">
+          <label for="inputEmail4" class="form-label">Name</label>
+          <input type="text" class="form-control" id="inputEmail4" required>
+        </div>
+        <div class="col-md-6">
+          <label for="inputphone" class="form-label">Number</label>
+          <input type="tel" class="form-control" id="inputPassword4" maxlength="10" required>
+        </div>
+        <div class="col-12">
+          <label for="inputAddress" class="form-label">Email Address</label>
+          <input type="text" class="form-control" id="inputAddress" placeholder="[email protected]" required>
+        </div>
+        <div class="col-12">
+          <label for="inputAddress2" class="form-label">Address</label>
+          <input type="text" class="form-control" id="inputAddress2" placeholder="Apartment, studio, or floor" required>
+        </div>
+
+
+        <div class="col-md-4">
+          <label for="inputState" class="form-label">State</label>
+          <select id="inputState" class="form-select" required>
+          <option selected>Select your State</option>
+          <option>Andhra Pradesh</option>
+        <option>Arunachal Pradesh</option>
+        <option>Assam</option>
+        <option>Bihar</option>
+        <option>Chhattisgarh</option>
+        <option>Goa</option>
+        <option>Gujarat</option>
+        <option>Haryana</option>
+        <option>Himachal Pradesh</option>
+        <option>Jharkhand</option>
+        <option>Karnataka</option>
+        <option>Kerala</option>
+        <option>Madhya Pradesh</option>
+        <option>Maharashtra</option>
+        <option>Manipur</option>
+        <option>Meghalaya</option>
+        <option>Mizoram</option>
+        <option>Nagaland</option>
+        <option>Odisha</option>
+        <option>Punjab</option>
+        <option>Rajasthan</option>
+        <option>Sikkim</option>
+        <option>Tamil Nadu</option>
+        <option>Telangana</option>
+        <option>Tripura</option>
+        <option>Uttar Pradesh</option>
+        <option>Uttarakhand</option>
+        <option>West Bengal</option>
         </select>
       </div>
+
+
+        <div class="col-md-6">
+          <label for="inputCity" class="form-label">City</label>
+          <input type="text" class="form-control" id="inputCity" required>
+        </div>
+
       <div class="col-12 submit">
         <button type="submit" class="btn btn-primary">Order Now</button>
       </div>
+
     </form>
 </div>
 </div>