Future-You/index.html at main · Jonimz/Future-You · 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
<!DOCTYPE html>
<html>
  <head>
  <title>Future You</title>
    <meta name="description" content="A Catalog showcasing your future self: goals, dreams and inspiration." />
    <link rel="stylesheet" href="style.css" />
    <script type="text/javascript" src="scripts.js"></script>
  </head>

  <body>
    <header class="main-header">
      <h1 class="title">Future You</h1>
      <h2 class="subtitle">Dream it. Plan it. Achieve it</h2>
      <input
        type="text"
        id="search-input"
        placeholder="What's your dream job..."
        />
        <button onclick="searchCareer();">Search</button>
      </header>

    <div id="card-container"></div>

    <div id="no-results" style="display: none; text-align: center; margin: 40px;">
      <h3>Your career isn't here?</h3>
      <p>
        Check here for more options!
        <a href="https://www.mynextmove.org/" target="_blank">here</a>.
      </p>
    </div>

    <div class="card" style="display: none">
      <div class="card-content">
        <h2 class="card-title">Career Title</h2>
      <img class="card-image" src="" alt="Career Image"/>
      <p class="card-description"></p>
    <ul class ="card-goals">
      <li>Goal 1</li>
      <li>Goal 2</li>
    </ul>
    <p class="card-quote"></p>
  </div>
    <div class="footer">
      <button onclick="quoteAlert();">Click Me!</button>
    </div>
  </body>
</html>