You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
67 lines
1.7 KiB
67 lines
1.7 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
</head>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
|
|
<meta name="description" content="" />
|
|
<meta name="author" content="" />
|
|
<title>Quiz</title>
|
|
<link rel="icon" type="image/x-icon" href="{{base}}/assets/favicon.ico"/>
|
|
<!-- Google fonts-->
|
|
<link href="https://fonts.googleapis.com/css?family=Varela+Round" rel="stylesheet" />
|
|
<link
|
|
href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i"
|
|
rel="stylesheet" />
|
|
<link href="{{base}}/css/quiz.css" rel="stylesheet" />
|
|
</head>
|
|
<style>
|
|
body {
|
|
font-family: 'Arial', sans-serif;
|
|
margin: 0;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 100vh;
|
|
background-image: url("{{base}}/assets/img/fond_quiz.jpg");
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
#quiz{
|
|
background-color: #8833d2;
|
|
}
|
|
|
|
</style>
|
|
<body >
|
|
|
|
<section id="quiz">
|
|
<h1>{{listName}}</h1>
|
|
<div id="questionContainer">
|
|
{% if questions is defined %}
|
|
{% for i in 0..questions|length %}
|
|
<div class="question" id="question{{ i }}">
|
|
<h2>{{ questions[i] }}</h2>
|
|
<div class="answers">
|
|
<form id="quizForm{{ i }}" method="post">
|
|
{% for answer in answers[i] %}
|
|
{% if answer == goodAnswers[i] %}
|
|
<input type="button" value="{{ answer }}" onclick="validateAndNext(true)">
|
|
{% else %}
|
|
<input type="button" value="{{ answer }}" onclick="validateAndNext(false)">
|
|
{% endif %}
|
|
{% endfor %}
|
|
</form>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
{% endif %}
|
|
</div>
|
|
|
|
<script> var len = JSON.parse('{{ questions | length }}'); </script>
|
|
|
|
<script src="{{base}}/js/quiz.js"></script>
|
|
</section>
|
|
</body>
|
|
</html>
|