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.
62 lines
2.4 KiB
62 lines
2.4 KiB
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Wiki Fantasy : Quiz</title>
|
|
<link id="favicon" rel="icon" href="../images/iconeSombre.ico"> <!-- Par défaut sombre -->
|
|
<link rel="stylesheet" href="../public/styles/styleQuiz.css">
|
|
<script defer src="../public/script/theme-toggle.js"></script>
|
|
<script>
|
|
// Timer pour 5 minutes
|
|
|
|
var timeLeft = 300;
|
|
function countdown() {
|
|
var timerDisplay = document.getElementById("timer");
|
|
if (timeLeft <= 0) {
|
|
document.getElementById("quizForm").submit();
|
|
} else {
|
|
timerDisplay.innerHTML = timeLeft + " seconds left";
|
|
timeLeft -= 1;
|
|
setTimeout(countdown, 1000);
|
|
}
|
|
}
|
|
window.onload = countdown;
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div class="header">
|
|
<div class="nav">
|
|
<a href="favorite.html"><img src="../images/coeur.svg" alt="coeur" width="67px" height="67px" onmousedown="return false"></a>
|
|
<img id="theme-icon" src="../images/light.svg" alt="toggle theme" width="72px" height="37px" onmousedown="return false" onclick="toggleTheme()">
|
|
<img src="../images/quizz.svg" alt="quizz" width="51px" height="82px" onmousedown="return false">
|
|
</div>
|
|
<div class="logo">
|
|
<a href="accueil.html"><img src="../images/WIKIFANTASY.png" alt="Logo" width="227px" height="106px" onmousedown="return false"></a>
|
|
</div>
|
|
<div class="user">
|
|
<img src="../images/user_dark.png" alt="user" width="70px" height="70px" onmousedown="return false">
|
|
</div>
|
|
</div>
|
|
|
|
<h1>▶ Quiz ◀</h1>
|
|
|
|
<div class="quiz">
|
|
<h2>Question 1</h2>
|
|
<p>“Tu es un sorcier Harry”</p>
|
|
|
|
<!-- Grille de réponses (2 par ligne) -->
|
|
<div class="answers">
|
|
<button class="answer">Fight Club</button>
|
|
<button class="answer">Jurassic World</button>
|
|
<button class="answer">La 7ème compagnie</button>
|
|
<button class="answer">Harry Potter à l'école des sorciers</button>
|
|
</div>
|
|
|
|
<div class="submit-button">
|
|
<button class="buttonSudmite" type="submit">Confirmer</button>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|