Skip to content

Commit abfa60e

Browse files
authored
Merge pull request #124 from LeeConnelly12/create_signup_form
created sign up form
2 parents a93b4f2 + f7067f9 commit abfa60e

File tree

2 files changed

+107
-0
lines changed

2 files changed

+107
-0
lines changed
Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
8+
<title>Contact form</title>
9+
<link rel="stylesheet" href="./style.css">
10+
</head>
11+
12+
<body>
13+
14+
<section class="contact-form">
15+
<h1>Sign up form</h1>
16+
<fieldset>
17+
<input type="text" name="first_name" id="first_name" placeholder="First name">
18+
</fieldset>
19+
<fieldset>
20+
<input type="text" name="last_name" id="last_name" placeholder="Last name">
21+
</fieldset>
22+
<fieldset>
23+
<input type="email" name="email" id="email" placeholder="Email">
24+
</fieldset>
25+
<fieldset>
26+
<input type="password" name="password" id="password" placeholder="Password">
27+
</fieldset>
28+
<fieldset>
29+
<button type="submit">Sign up</button>
30+
</fieldset>
31+
</section>
32+
33+
</body>
34+
35+
</html>
Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
* {
2+
box-sizing: border-box;
3+
}
4+
5+
html,body {
6+
height: 100%;
7+
}
8+
9+
body {
10+
margin: 0;
11+
font-family: sans-serif;
12+
display: flex;
13+
align-items: center;
14+
justify-content: center;
15+
color: #fff;
16+
}
17+
18+
.contact-form {
19+
width: 100%;
20+
max-width: 400px;
21+
margin: auto;
22+
background-color: #24297d;
23+
padding: 25px;
24+
}
25+
26+
h1 {
27+
margin-top: 0;
28+
margin-bottom: 20px;
29+
}
30+
31+
fieldset {
32+
border: 0;
33+
padding-left: 0;
34+
}
35+
36+
label {
37+
display: block;
38+
margin-bottom: 4px;
39+
}
40+
41+
textarea {
42+
resize: none;
43+
height: 100px;
44+
}
45+
46+
input {
47+
height: 40px;
48+
padding-left: 15px;
49+
color: white;
50+
}
51+
52+
input,
53+
textarea {
54+
width: 100%;
55+
border: 1px solid #d7d7d7;
56+
background-color: transparent;
57+
}
58+
59+
button {
60+
border: 0;
61+
background-color: #21c100;
62+
color:white;
63+
font-weight: bold;
64+
text-transform: uppercase;
65+
height: 40px;
66+
max-width: 110px;
67+
width: 100%;
68+
text-transform: uppercase;
69+
letter-spacing: 1px;
70+
display: block;
71+
margin-left: auto;
72+
}

0 commit comments

Comments
 (0)