-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
105 lines (101 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
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description"
content="The landing page that use SPACEX public API to display the timeline of rocket launches of the SPACEX company" />
<title>SpaceX Rocket Launches</title>
<!-- 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=Trispace:wght@300;400;600;700&display=swap" rel="stylesheet">
<!-- Favicon -->
<link rel="apple-touch-icon" sizes="57x57" href="./ico/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="./ico/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="./ico/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="./ico/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="./ico/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="./ico/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="./ico/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="./ico/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="./ico/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="./ico/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="./ico/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="./ico/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="./ico/favicon-16x16.png">
<link rel="manifest" href="./ico/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="./ico/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<!-- Styles -->
<link rel="stylesheet" href="./normalize.css" />
<link rel="stylesheet" href="./style.css" />
<link rel="stylesheet" href="./media.css" />
<link rel="stylesheet" href="./loader.css" />
</head>
<body>
<header class="header" id="header">
<nav class="header__nav" id="nav">
<a href="#header" class="header__nav-link">
<picture>
<source srcset="./img/header__logo.webp" type="image/webp">
<img src="./img/header__logo.png" alt="SpaceX logo">
</picture>
</a>
<a href="#about" class="header__nav-link">ABOUT</a>
<a href="#launches" class="header__nav-link">LAUNCHES</a>
<a href="#follow" class="header__nav-link">FOLLOW US</a>
</nav>
<div class="header__title">
<p class="header__title-p" id="typing__text">
</p>
<h1 class="header__title-h1"> - ELON MUSK, CEO OF SPACEX</h1>
</div>
</header>
<div class="about" id="about">
<h2 class="about__title">ABOUT</h2>
<p class="about__text">SpaceX, in full Space Exploration Technologies Corporation, American
aerospace
company
founded in 2002 that helped usher
in the era of commercial spaceflight. It was the first private company to successfully launch and return
a
spacecraft
from Earth orbit and the first to launch a crewed spacecraft and dock it with the International Space
Station (ISS).
Headquarters are in Hawthorne, California.</p>
</div>
<div class="launches" id="launches">
<h2 class="launches__title">LAUNCHES</h2>
<p class="launches__subtitle">*Click on each launch to know more about its details</p>
<div class="launches__loader"></div>
<div class="launches__layout"></div>
<div class="launches__modal"></div>
<button class="launches__button" id="loader" onclick="loadMore()"></button>
</div>
<footer class="follow" id="follow">
<a href="#header">SPACEX © 2022</a>
<a href="https://twitter.com/spacex">TWITTER</a>
<a href="https://www.youtube.com/spacex">YOUTUBE</a>
<a href="https://www.instagram.com/spacex/">INSTAGRAM</a>
<a href="https://www.flickr.com/photos/spacex">FLICKR</a>
<a href="https://www.linkedin.com/company/spacex">LINKEDIN</a>
<a href="https://www.spacex.com/media/privacy_policy_spacex.pdf">PRIVACY POLICY</a>
</footer>
</body>
<script src="./nav.js"></script>
<script src="./script.js"></script>
<script src="./type.js"></script>
<script src="./modernizr-custom.js"></script>
<script>
Modernizr.on('webp', function (result) {
if (result) {
// supported
} else {
// not-supported
}
});
</script>
</html>