firefly-inc/index.html at master · MartinBoylan/firefly-inc · 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
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
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
  <title>CodePen - Firefly Inc</title>
  <link rel="stylesheet" href="./style.css">

</head>

//Just making a change to see what happens//
<body>
<!-- partial:index.partial.html -->
<!DOCTYPE html>
<html lang="en">
<head>
  <title>Firefly Spaceships Inc</title>
</head>
  <body class="body">
  <header id="header">
    <img src="https://outintheblack.files.wordpress.com/2013/06/firefly-logo.jpg?w=640" alt="firefly logo" id="header-img"/>
    <nav id="nav-bar">

      <ul>
        <li><a href="#Our-Ships" class="nav-link">Our Ships</a></li>
        <li><a href="#video" class="nav-link">Relax</a></li>
        <li><a href="#Contact" class="nav-link">Contact</a></li>
      </ul>
    </nav>
  </header>
  <article class="article">
  <h1 class="h1">Firefly Inc</h1>
      <section>
        <img class="image-right" src="https://get.wallhere.com/photo/3200x2000-px-Firefly-Serenity-spaceship-1224862.jpg" alt="big firefly ship"/>
        <h2 id="Our-Ships" class="h2">
      Big Ships
        </h2>
        <p class="content">
      Big Ships are super-great. They have lots of space for storage and hanging out. They don't go very fast but thats because they are quite large.
        </p>
      </section>
      <section>
        <img class="image-left" src="https://vignette.wikia.nocookie.net/firefly/images/3/3c/Shuttle.jpg/revision/latest?cb=20080529211814" alt="Small shuttle"/>
        <h2 class="h2">
      Small Ships
        </h2>
        <p class="content">
      Small ships go fast and they are good if you don't need to go very far. At the end of the day you get what you pay for so don't come crying.
        </p>
        <pre>


        </pre>
      </section>
      <section>
        <img class="image-right" src="https://storiesbywilliams.files.wordpress.com/2012/05/reaver3.png" alt="picture of cool ship"/>
        <h2 class="h2">Cool Ships</h2>

        <p class="content">
      Cool ships are cool man what more do you want from me?
        </p>

        <h2 class="h2">Chill</h2>
      </section>
      <iframe id="video" width="560" height="315" src="https://www.youtube-nocookie.com/embed/H_esf-DATZc" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
      <h2 class="h2">
        Problems
      </h2>
      <p class="content">If you have any problems with our ships it could be lots of things. Follow this procedure.
      </p>
      <ol class="content">
        <li>1. Check the <a href="https://en.wikipedia.org/wiki/Internet" target="_blank">internet</a></li>
        <li>
        2. Have you tried acupuncture? I heard it's really good           </li>
        <li>3. Send a fax somewhere</li>
      </ol>

    <pre>


    </pre>
    <div class="content">
      Give us you're email.
    </div>

    <form id="form" action="https://www.freecodecamp.org/email-submit" method="post">
      <input id="email" type="email" name="email" value="email address" placeholder="email">
      <input type="submit" value="submit" id="submit" class="form">
    </form>
    <pre>


    </pre>
    </article>
  <footer class="flex-container">
    <section>
      <h3>
        Finance
      </h3>
        <p>
         We offer finance options. Please call Mandy on Tuesdays between 11:30am and 1pm
        </p>
      </section>
    <section id="Contact">
      <h3>Contact</h3>
      <p>
        You can also phone this number - 0840 BE NICE
      </p>
    </section>
    <section>
      <h3>
        Disclaimer
      </h3>
      <p>
        If this doesn't work out it's your fault for not believing in it enough.
      </p>
    </section>
    </footer>
  </body>
  </html>
<!-- partial -->

</body>
</html>