TriviaGame/index.html at master · wongulus/TriviaGame · 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
<!DOCTYPE html>
<html lang="en-us">
<head>
  <meta charset="utf-8">
  <title>Trivia!</title>
  <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <link href="https://fonts.googleapis.com/css?family=Anton|Roboto:900|Work+Sans:700" rel="stylesheet">
  <link rel="stylesheet" type="text/css" href="assets/css/style.css">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
    <div class="container-fluid" id="pageContainer">
    <img id="seal" src="assets/images/pawnee-seal.png">
    <div class="row">
      <div class="col-xs-12 text-center" id="titleBox">
        <h1>Parks <small>and</small> Recreation Trivia!</h1>
      </div>
    </div> <!-- End of Title Box Row -->
    <div class="row" id="main-window">
      <div class="col-xs-12">
        <div class="row">
          <div class="col-xs-12 text-center">
            <div id="welcomeImage">
              <img src="assets/images/parksrec-crop.png" class="img-responsive">
            </div>
            <div id="welcome">
              <!-- <h1>Welcome to Parks & Rec Trivia!</h1> -->
              <h2>Press Start to begin the quiz!</h2>
            </div>
            <h2><div id="message" class="hidden">

            </div></h2>
          </div>
        </div>
        <div class="row">
          <div class="col-xs-12 text-center hidden" id="content">
            <!-- <div id="onStart" class="hidden">
              All of this gets added in when the start button is clicked.
              <div><h4>Time Left: <span id="timeLeft"></span> Seconds</h4></div>
              <div class="prompt"><h2>Question: <span id="question">Question</span></h2></div>
              <div class="answer-line"><h3><span class="answer" id="option1">option 1</span></h3></div>
              <div class="answer-line"><h3><span class="answer" id="option2">option 2</span></h3></div>
              <div class="answer-line"><h3><span class="answer" id="option3">option 3</span></h3></div>
              <div class="answer-line"><h3><span class="answer" id="option4">option 4</span></h3></div>
            </div> -->
          </div>
        </div>
        <div class="row last-row">
          <div class="col-xs-6 col-xs-offset-3 text-center">
            <div id="buttons">
              <button type="button" class="btn btn-success btn-md" id="start">Start</button>
              <button type="button" class="btn btn-success btn-md pull-right invisible" id="next">Next</button>
            </div>
          </div>
        </div>
      </div>
    </div> <!-- End of main-window -->
  </div>
  <script type="text/javascript" src="assets/javascript/app.js"></script>
</body>
</html>