Skip to content

Commit df5f817

Browse files
committed
created a new branch feature/form-controls
1 parent d28242a commit df5f817

1 file changed

Lines changed: 43 additions & 6 deletions

File tree

‎Form-Controls/index.html‎

Lines changed: 43 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -13,15 +13,52 @@ <h1>Product Pick</h1>
1313
</header>
1414
<main>
1515
<form>
16-
<!-- write your html here-->
17-
<!--
18-
try writing out the requirements first as comments
19-
this will also help you fill in your PR message later-->
16+
<!-- 1. Customer's Name -->
17+
<div>
18+
<label for="name">Customer Name:</label>
19+
<input type="text" id="name" name="name" required pattern=".*\S.*\S.*" title="Name must contain at least two characters.">
20+
</div>
21+
22+
<!-- 2. Customer's Email -->
23+
<div>
24+
<label for="email">Email Address:</label>
25+
<input type="email" id="email" name="email" required>
26+
</div>
27+
28+
<!-- 3. T-Shirt Colour -->
29+
<div>
30+
<label for="colour">Choose a Colour:</label>
31+
<select id="colour" name="colour" required>
32+
<option value="">--Please choose a colour--</option>
33+
<option value="red">Red</option>
34+
<option value="blue">Blue</option>
35+
<option value="green">Green</option>
36+
</select>
37+
</div>
38+
39+
<!-- 4. T-Shirt Size -->
40+
<div>
41+
<label for="size">Choose a Size:</label>
42+
<select id="size" name="size" required>
43+
<option value="">--Please choose a size--</option>
44+
<option value="XS">XS</option>
45+
<option value="S">S</option>
46+
<option value="M">M</option>
47+
<option value="L">L</option>
48+
<option value="Xl">XL</option>
49+
<option value="XXL">XXL</option>
50+
</select>
51+
</div>
52+
53+
<!-- Submit Button -->
54+
<div>
55+
<button type="submit">Submit Order</button>
56+
</div>
2057
</form>
2158
</main>
2259
<footer>
23-
<!-- change to your name-->
24-
<p>By HOMEWORK SOLUTION</p>
60+
<!-- Replace 'YOUR NAME' below with your real name -->
61+
<p>By YOUR NAME</p>
2562
</footer>
2663
</body>
2764
</html>

0 commit comments

Comments
 (0)