-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsimple-quiz-app.html
executable file
·136 lines (109 loc) · 4.66 KB
/
simple-quiz-app.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
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<!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">
<title>Simple Quiz App</title>
<link rel="shortcut icon" href="public/images/logo.png" type="image/png">
<!-- Jquery UI -->
<link rel="stylesheet" href="public/css/jquery-ui.min.css">
<!-- Bootstrap -->
<link rel="stylesheet" href="public/css/bootstrap.min.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="public/css/font-awesome.min.css">
<!-- Style -->
<link rel="stylesheet" href="public/css/main.css">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<main>
<div class="simple-quiz-app">
<div class="container">
<div class="item panel-0" data-panel="0">
<div class="wrapper active">
<h1>SQuiz</h1>
<button class="start-quiz btn btn-success text-capitalize" data-next="1">start quiz</button>
</div>
</div>
<!-- .item -->
<div class="item panel-1" data-panel="1">
<div class="wrapper">
<h1>How do you think about this project?</h1>
<div class="options">
<p>Nice</p>
<p>Flat</p>
<p>Bad</p>
</div>
<!-- .options -->
<button class="btn btn-success btn-next text-capitalize" data-next="2">next question</button>
</div>
</div>
<!-- .item -->
<div class="item panel-2" data-panel="2">
<div class="wrapper">
<h1>How do you think me?</h1>
<div class="options">
<p>Handsome</p>
<p>Strange</p>
<p>Ugly</p>
</div>
<!-- .options -->
<button class="btn btn-success btn-next text-capitalize" data-next="3">next question</button>
</div>
</div>
<!-- .item -->
<div class="item panel-3" data-panel="3">
<div class="wrapper">
<h1>What programming language do you like?</h1>
<div class="options">
<p>Javascript</p>
<p>Ruby</p>
<p>PHP</p>
</div>
<!-- .options -->
<button class="btn btn-success btn-next text-capitalize" data-next="4">next question</button>
</div>
</div>
<!-- .item -->
<div class="item panel-4" data-panel="4">
<div class="wrapper">
<h1>How many stars will you give for this project?</h1>
<div class="options">
<p>5 Stars</p>
<p>3 Stars</p>
<p>1 Star</p>
</div>
<!-- .options -->
<button class="btn btn-success btn-next text-capitalize" data-next="5">next question</button>
</div>
</div>
<!-- .item -->
<div class="item panel-5" data-panel="5">
<div class="wrapper">
<h1>Thank you for participating :)</h1>
</div>
</div>
<!-- .item -->
<div class="error">
<p>Please make a selection</p>
</div>
<!-- .error -->
</div>
<!-- .container -->
</div>
<!-- .simple-quiz-app -->
</main>
<!-- Jquery -->
<script src="public/js/jquery-3.2.1.min.js"></script>
<!-- Jquery -->
<script src="public/js/jquery-ui.min.js"></script>
<!-- Tabs Widget -->
<script src="public/js/simple-quiz-app.js"></script>
</body>
</html>