-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsignup.html
134 lines (125 loc) · 6.78 KB
/
signup.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>TheShoeBox. Sign Up</title>
<link href="signup.css" rel="stylesheet" />
<link href="default.css" rel="stylesheet" />
<script src="https://kit.fontawesome.com/868c6ab4df.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
<script type="module" src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.esm.js"></script>
<script nomodule="" src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div class="top-bttn">
<i class="fas fa-arrow-up"></i>
</div>
<div class="container">
<header>
<h1 class="logo">TheShoeBox.</h1>
<input type="checkbox" id="nav-toggle" class="nav-toggle">
<nav>
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="contact.html">CONTACT</a></li>
<li><a href="signup.html">SIGN UP</a></li>
</ul>
</nav>
<label for="nav-toggle" class="nav-toggle-label">
<span></span>
</label>
</header>
<div id="logincontainer">
<div id="login-box">
<div class="left-box">
<h1> Sign up with your email address</h1>
<p> Create an account and start receiving new shoes every month</p>
<div id="error"></div>
<form id="enrollForm" action="/" method="GET">
<div/div action="#" method="GET">
<div>
<input id="email" type="email" name="email" placeholder="*Email" />
</div>
<div>
<input id="email2" type="email" name="email1" placeholder="*Confirm email" />
</div>
<div>
<input id="name" type="text" name="nickname" placeholder="*What should we call you?" />
</div>
<div>
<input id="password" type="password" name="password" placeholder="*Password" />
</div>
<div>
<input id="password2" type="password" name="password2" placeholder="*Retype password" />
</div>
<p class="dateofbirth">Date of birth</p>
<div class="birthday">
<input id="day" type="number" name="day" placeholder="Day" min="1" max="31">
<div class="custom-select" style="width:200px;">
<select id="month">
<option value="">Month</option>
<option value="january">January</option>
<option value="february">February</option>
<option value="march">March</option>
<option value="april">April</option>
<option value="may">May</option>
<option value="june">June</option>
<option value="july">July</option>
<option value="august">August</option>
<option value="september">September</option>
<option value="october">October</option>
<option value="november">November</option>
<option value="december">December</option>
</select>
</div>
<input id="year" type="number" name="year" placeholder="Year" min="1900" max="2005">
</div>
<div class="radio">
<label for="male">Male</label>
<input type="radio" name="gender" id="male" value="male">
<label for="female">Female</label>
<input type="radio" name="gender" id="female" value="female">
<label for="non-binary">Non-binary</label>
<input type="radio" name="gender" id="non-binary" value="non-binary">
</div>
<p> We may send you emails with news or promotions occasionally</p>
<a class="agree">
<input id="checkbox" type="checkbox" name="agree">
<label for="agree"> I agree to TheShoeBox. terms & conditions and Privacy
policy</label>
</a>
<div class="signup-container">
<input type="submit" onclick="enroll();" name="signup-button" value="Sign Up" />
</div>
</div>
</form>
</div>
<div class="right-box">
<span class="signinwith">Sign in with<br /> Social Network </span>
<button class="social facebook"> Log in with Facebook</button>
<button class="social twitter"> Log in with Twitter</button>
<button class="social google"> Log in with Google+</button>
</div>
<div class="or">
OR
</div>
</div>
</div>
<div class="bottomPage">
<h1> Join our newsletter!</h1>
<h2>Be the first to know about new products, news and promotions.</h2>
<form id="newsLetter">
<input type="email" id="subscribebtn" placeholder="Your Email">
<button type="submit" onclick="footer();"><i class="fas fa-arrow-right"></i></button>
</form>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
</div>
<script defer src="backtotop.js"></script>
<script defer src="btmpage.js"></script>
<script defer src="formvalidation.js"></script>
</body>
</html>