-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
100 lines (96 loc) · 3.09 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
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
rel="icon"
type="image/png"
sizes="32x32"
href="./assets/favicon-32x32.png"
/>
<!-- Google fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;700&family=Bellefair&family=Barlow:wght@400;700&display=swap"
rel="stylesheet"
/>
<!-- Our custom CSS -->
<link rel="stylesheet" href="style.css" />
<title>Frontend Mentor | Space tourism website</title>
<script src="Navigation.js" defer></script>
</head>
<body class="home">
<a class="skip-to-content" href="#main">Skip to content</a>
<header class="primary-header flex">
<div>
<img
src="./assets/shared/logo.svg"
alt="space tourism logo"
class="logo"
/>
</div>
<button class="mobile-nav-toggle" aria-controls="primary-navigation">
<span class="sr-only" aria-expanded="false">Menu</span>
</button>
<nav>
<ul
id="primary-navigation"
data-visible="false"
class="primary-navigation underline-indicators flex"
>
<li class="active">
<a
class="ff-sans-cond uppercase text-white letter-spacing-2"
href="index.html"
><span aria-hidden="true">00</span>Home</a
>
</li>
<li>
<a
class="ff-sans-cond uppercase text-white letter-spacing-2"
href="destination.html"
><span aria-hidden="true">01</span>Destination</a
>
</li>
<li>
<a
class="ff-sans-cond uppercase text-white letter-spacing-2"
href="crew.html"
><span aria-hidden="true">02</span>Crew</a
>
</li>
<li>
<a
class="ff-sans-cond uppercase text-white letter-spacing-2"
href="technology.html"
><span aria-hidden="true">03</span>Technology</a
>
</li>
</ul>
</nav>
</header>
<main id="main" class="grid-container grid-container--home">
<div>
<h1 class="text-accent fs-500 ff-sans-cond uppercase letter-spacing-1">
So, you want to travel to
<span class="d-block fs-900 ff-serif text-white">Space</span>
</h1>
<p class="text-accent">
Let’s face it; if you want to go to space, you might as well genuinely
go to outer space and not hover kind of on the edge of it. Well sit
back, and relax because we’ll give you a truly out of this world
experience!
</p>
</div>
<div>
<a
href="destination.html"
class="large-button uppercase ff-serif text-dark bg-white"
>Explore</a
>
</div>
</main>
</body>
</html>