-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsign-up.html
executable file
·86 lines (66 loc) · 2.33 KB
/
sign-up.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./css/main.css">
<link rel="icon" type="image/png" sizes="32x32" href="./assets/favicon-32x32.png">
<title>Frontend Mentor | Officelite coming soon site</title>
</head>
<body class="sign-up">
<header>
<a href="./index.html">
<img class='logo' src="./assets/shared/logo.svg" alt="Officelite">
</a>
</header>
<main>
<section class="top">
<h1>Work smarter. Save time.</h1>
<p>
Easily manage your projects. Get on the list and receive in-app perks available only to
early subscribers. We are moving into final development and getting ready for official launch soon.
</p>
</section>
<!-- If you're choosing to make this date dynamic, set it to 30 days in the future from the moment the visitor views the page -->
<div class="date-cont ">
<p>
Coming
<span class="date">4 Nov 2020</span>
</p>
</div>
<!-- If you're choosing to make this timer dynamic, have it countdown from the date you set above -->
<div class="countdown">
<div class="timer-card">
<h2>47</h2>
<p>Days</p>
</div>
<div class="timer-card">
<h2>07</h2>
<p>Hours</p>
</div>
<div class="timer-card">
<h2>56</h2>
<p>Min</p>
</div>
<div class="timer-card">
<h2>14</h2>
<p>Sec</p>
</div>
</div>
<form action="">
<input aria-label="Name" type="text" placeholder="Name">
<input aria-label='email' type="email" name="email" id="" placeholder="email">
<select aria-label='select plan' name="" id="">
<option aria-label='free' value="Free"><span>Basic</span> Free</option>
<option aria-label='pro' value="Pro"><span>Pro</span> 9.99</option>
<option aria-label='ultimate' value="Ultimate"><span>Ultimate</span> 19.99</option>
</select>
<input aria-label='phone' type="number" name="" id="" placeholder="Phone Number">
<input aria-label='company' type="text" name="" id="" placeholder="Company">
<button class="btn btn--blue" aria-label='Get on the list'>Get on the list</button>
</form>
</main>
<div class="footer">
</div>
</body>
</html>