-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
79 lines (73 loc) · 4.85 KB
/
index.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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>GenerationSpace</title>
<meta name="description" content="Stay up to date when humans touc the sky.">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="manifest" href="site.webmanifest">
<link rel="mask-icon" href="safari-pinned-tab.svg" color="#3326cb">
<meta name="msapplication-TileColor" content="#3326cb">
<meta name="theme-color" content="#3326cb">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/screen.css">
<script src="./js/form.js"></script>
</head>
<body>
<div class="c-landing">
<div class="c-landing__intro c-intro">
<svg class="c-intro__logo c-logo" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128" viewBox="0 0 128 128">
<defs>
<clipPath id="clip-path">
<rect id="Rectangle_26" data-name="Rectangle 26" width="128" height="128" fill="none" stroke="#f3f2f8" stroke-width="3"/>
</clipPath>
</defs>
<g id="c-logo" clip-path="url(#clip-path)">
<g id="Group_7" data-name="Group 7" transform="translate(0.64 0.433)">
<path id="Path_25" data-name="Path 25" d="M32.153,121.983c13.6-13.6-1.7-28.865-15.335-15.335a20.476,20.476,0,0,1,6.955,1.939c-3.22.983-7.379,3.608-12.06,8.272a15.831,15.831,0,0,1,5.629-.28A84.791,84.791,0,0,0,9.16,129.614a84.791,84.791,0,0,0,13.035-8.182,15.822,15.822,0,0,1-.28,5.629C26.6,122.38,29.2,118.231,30.2,115a20.684,20.684,0,0,1,1.957,6.982Z" transform="translate(-1.538 -10.364)" stroke-miterlimit="10" stroke-width="3"/>
<path id="Path_26" data-name="Path 26" d="M67.127,79.516A156.958,156.958,0,0,0,86.179,63.279c23.246-23.246,34.44-49.748,31.887-52.319S89.02,19.6,65.747,42.848A157.136,157.136,0,0,0,49.574,61.989,69.584,69.584,0,0,0,.71,82.475L10.894,92.686c7.83-7.83,18.528-8.93,25.636-8.615-.379.857-.74,1.759-1.055,2.553l6.991,7.018c.8-.325,1.66-.686,2.553-1.082.316,7.108-.785,17.806-8.605,25.636l10.2,10.2A69.647,69.647,0,0,0,67.127,79.516Z" transform="translate(-0.71 -1.471)" stroke-miterlimit="10" stroke-width="3"/>
<path id="Path_27" data-name="Path 27" d="M130.81,10.051,140.381.48Z" transform="translate(-13.454 -0.48)" stroke-linecap="round" stroke-linejoin="round" stroke-width="3"/>
</g>
</g>
</svg>
<h1>GenerationSpace</h1>
<p>
From the beginning of time, mankind has always been curious about space.<br/><br/>
With GenerationSpace, you'll always stay up to date when humans touch the sky.
</p>
</div>
<figure class="c-landing__mockup">
<img src="./img/mockup.png" alt="Mock-up of the GenerationSpace app" />
</figure>
<div class="c-landing__form">
<form class="c-form" action="#">
<h3>Get notified about updates</h3>
<p class="c-form__item c-form-field js-name-field">
<label class="c-label js-label" for="name">
Name
</label>
<input class="c-input js-input" type="text" name="name" id="name" required />
<span class="c-error js-error"></span>
</p>
<p class="c-form__item c-form-field js-email-field">
<label class="c-label js-label" for="email">
Email
</label>
<input class="c-input js-input" type="email" name="email" id="email" required />
<span class="c-error js-error"></span>
</p>
<p class="c-form__item c-form-field">
<button class="o-button-reset c-button js-sign-up">Stay in touch</button>
</p>
</form>
</div>
</div>
</body>
</html>