Skip to content

Commit de8e254

Browse files
YonatanteklemariamYonatanteklemariam
committed
Added forms and validated
1 parent ff7b9d0 commit de8e254

5 files changed

Lines changed: 121 additions & 10 deletions

File tree

‎.vs/Module-Onboarding.slnx/v18/.wsuo‎

9.5 KB
Binary file not shown.

‎.vs/Module-Onboarding.slnx/v18/DocumentLayout.json‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{
2+
"Version": 1,
3+
"WorkspaceRootPath": "C:\\Users\\almzj\\CYF\\Module-Onboarding\\",
4+
"Documents": [],
5+
"DocumentGroupContainers": [
6+
{
7+
"Orientation": 0,
8+
"VerticalTabListWidth": 256,
9+
"DocumentGroups": [
10+
{
11+
"DockedWidth": 200,
12+
"SelectedChildIndex": -1,
13+
"Children": [
14+
{
15+
"$type": "Bookmark",
16+
"Name": "ST:129:0:{1fc202d4-d401-403c-9834-5b218574bb67}"
17+
},
18+
{
19+
"$type": "Bookmark",
20+
"Name": "ST:128:0:{116d2292-e37d-41cd-a077-ebacac4c8cc4}"
21+
}
22+
]
23+
}
24+
]
25+
}
26+
]
27+
}

‎.vs/VSWorkspaceState.json‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"ExpandedNodes": [
3+
""
4+
],
5+
"PreviewInSolutionExplorer": false
6+
}

‎.vs/slnx.sqlite‎

88 KB
Binary file not shown.

‎Form-Controls/index.html‎

Lines changed: 88 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,105 @@
11
<!DOCTYPE html>
22
<html lang="en">
33
<head>
4-
<meta charset="utf-8" />
5-
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
66
<title>My form exercise</title>
7-
<meta name="description" content="" />
8-
<meta name="viewport" content="width=device-width, initial-scale=1" />
7+
<meta name="description" content="">
8+
<meta name="viewport" content="width=device-width, initial-scale=1">
9+
10+
<style>
11+
12+
body {
13+
font-family: Arial, sans-serif;
14+
margin: 20px;
15+
background-color: #ffffff;
16+
color: #000000;
17+
}
18+
19+
header, footer {
20+
text-align: center;
21+
margin-bottom: 20px;
22+
}
23+
24+
form {
25+
max-width: 400px;
26+
margin: 0 auto;
27+
}
28+
29+
label {
30+
display: block;
31+
margin-top: 10px;
32+
}
33+
34+
input[type="text"],
35+
input[type="email"],
36+
select {
37+
width: 100%;
38+
padding: 8px;
39+
margin-top: 5px;
40+
box-sizing: border-box;
41+
}
42+
43+
button, input[type="submit"] {
44+
margin-top: 15px;
45+
padding: 10px 20px;
46+
background-color: #000000;
47+
color: #ffffff;
48+
border: none;
49+
cursor: pointer;
50+
}
51+
52+
input, select {
53+
color: #222222;
54+
background-color: #ffffff;
55+
}
56+
57+
</style>
58+
959
</head>
1060
<body>
1161
<header>
1262
<h1>Product Pick</h1>
1363
</header>
1464
<main>
1565
<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-->
66+
<label for="name">Customer Name</label>
67+
<input type="text" id="name" name="name" placeholder="Enter Your Name" pattern=".*\S.*\S.*" required>
68+
<br>
69+
<label for="email">Email</label>
70+
<input type="email" id="email" name="email" placeholder="Enter Your Email" required>
71+
<br>
72+
Choose a color:
73+
<div>
74+
<label for="red">Red</label>
75+
<input type="radio" id="red" name="color" value="red" required>
76+
</div>
77+
<div>
78+
<label for="black">Black</label>
79+
<input type="radio" id="black" name="color" value="black" required>
80+
</div>
81+
<div>
82+
<label for="cream">Cream</label>
83+
<input type="radio" id="cream" name="color" value="cream" required>
84+
</div>
85+
<br>
86+
<label for="size">Choose a size:</label>
87+
<select id="size" name="size" required>
88+
<option value="">Select a size</option>
89+
<option value="extrasmall">XS</option>
90+
<option value="small">S</option>
91+
<option value="medium">M</option>
92+
<option value="large">L</option>
93+
<option value="extralarge">XL</option>
94+
<option value="doubleextralarge">XXL</option>
95+
</select>
96+
<br>
97+
<button type="submit" value="Submit">Submit</button>
2098
</form>
2199
</main>
22100
<footer>
23101
<!-- change to your name-->
24-
<p>By HOMEWORK SOLUTION</p>
102+
<p>By Yonatan Teklemariam</p>
25103
</footer>
26104
</body>
27-
</html>
105+
</html>

0 commit comments

Comments
 (0)