-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
58 lines (55 loc) · 2.75 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- google fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<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">
<!-- custom css -->
<link rel="stylesheet" href="./static/design-system-v2.css">
<link rel="stylesheet" href="./static/index.css">
<link rel="icon" type="image/png" sizes="32x32" href="./assets/favicon-32x32.png">
<!-- custom js -->
<script src="./static/navigation.js" defer></script>
<title>Frontend Mentor | Space tourism website</title>
</head>
<body class="home">
<a class="skip-to-content" href="#main">skip to content</a>
<!-- navigation -->
<header class="primary-header flex">
<div>
<a href="index.html">
<img src="./assets/shared/logo.svg" alt="space tourism logo" class="logo">
</a>
</div>
<button class="mobile-nav-toggle" aria-controls="primary-navigation"><i class="material-icon ssr-only" aria-expanded="false">menu</i></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><a class="ff-sans-cond uppercase text-white letter-spacing-2" href="destination.html"><span aria-hidden="true">01</span>Destination</a>
<li><a class="ff-sans-cond uppercase text-white letter-spacing-2" href="crew.html"><span aria-hidden="true">02</span>Crew</a>
<li><a class="ff-sans-cond uppercase text-white letter-spacing-2" href="technology.html"><span aria-hidden="true">03</span>Technology</a>
</ul>
</nav>
</header>
<!-- section -->
<main id="main" class="grid-container grid-container--home">
<div>
<h5 class="ff-sans-cond fs-500 uppercase letter-spacing-1 text-accent">So, you want to travel to</h5>
<span class="f-serif fs-900 uppercase d-block">Space</span>
<p>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 style="display: flex; justify-content: flex-end; align-items: flex-start;"> -->
<div>
<a href="destination.html" class="btn-large">
Explore</a>
</div>
</main>
</body>
</html>