space-tourism-website/index.html at master · oppahero/space-tourism-website · GitHub

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
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Space Tourism Website - by María López</title>
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="./assets/favicon-32x32.png"
    />
    <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&family=Barlow+Condensed&family=Bellefair&display=swap"
      rel="stylesheet"
    />

    <link rel="stylesheet" href="styles/normalize.css" />
    <link rel="stylesheet" href="styles/global-styles.css" />
    <link rel="stylesheet" href="styles/home.css" />
  </head>
  <body>
    <nav role="navigation">
      <img class="logo" src="assets/shared/logo.svg" alt="Logo" />
      <ul class="nav-ul">
        <img
          class="nav-ul__close"
          src="assets/shared/icon-close.svg"
          alt="icon to close menu"
        />
        <li class="nav-ul__li active">
          <a href="#"><span>00</span> HOME</a>
        </li>
        <li class="nav-ul__li">
          <a href="pages/destination.html"><span>01</span> DESTINATION</a>
        </li>
        <li class="nav-ul__li">
          <a href="../pages/crew.html"><span>02</span> CREW</a>
        </li>
        <li class="nav-ul__li">
          <a href="#"><span>03</span> TECHNOLOGY</a>
        </li>
      </ul>
      <img
        class="nav-ul__hamburger"
        src="assets/shared/icon-hamburger.svg"
        alt=""
      />
    </nav>
    <main role="main">
      <div class="container__text">
        <h5>So, you want to travel to</h5>
        <h1>SPACE</h1>
        <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 class="container__circle">
        <h4 class="container__circle__link">Explore</h4>
      </div>
    </main>
    <script src="js/script.js"></script>
  </body>
</html>