-
Notifications
You must be signed in to change notification settings - Fork 4
/
rules.html
100 lines (95 loc) · 3.49 KB
/
rules.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Quizaa</title>
<link rel="stylesheet" href="./CSS/style.css" />
<link rel="stylesheet" href="./CSS/rules.css" />
<link rel="preconnect" href="https://fonts.gstatic.com" />
<link
href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap"
rel="stylesheet"
/>
<script src="./Scripts/main.js"></script>
</head>
<body>
<header class="header"><a href="./menu.html">QUIZAA</a></header>
<main class="main">
<h1 class="title">Rules</h1>
<div class="rules-container flex">
<div class="rules-txt">
<p>
<b>
Quizaa is a game of "Higher" or "Lower" where you can play against
one or more bots. The game is based on the quality of your memory,
and a bit of luck.
</b>
</p>
<p>
The Quizaa game leader has choosen a number, and it is up to you to
try and guess the correct number before your opponent/s do. If your
guess is wrong, the game leader will tell you weather the correct
number is "Higher!" or "Lower!". The same goes for the bots, so if
they don't get it right either you can use their answers to your
advantage. The bots have different internal logic for choosing a
number, and can be more or less difficult to go up against.
</p>
</div>
<div class="rules-list">
<div class="list-item flex row">
<div class="circle flex">
<p class="list-number">1</p>
</div>
<p>
Click "Start Quizaa" and choose one or more bots to play against.
</p>
</div>
<div class="list-item flex row">
<div class="circle flex">
<p class="list-number">2</p>
</div>
<p>
You will then be promted to write a number. Make sure you write a
valid number within the range that is visible on screen.
</p>
</div>
<div class="list-item flex row">
<div class="circle flex">
<p class="list-number">3</p>
</div>
<p>
Make sure to answer quickly, you have five seconds. If you do not
answer in time, you will not be able to guess during this round.
</p>
</div>
<div class="list-item flex row">
<div class="circle flex">
<p class="list-number">4</p>
</div>
<p>
Then it is the bots turn to guess. If one or more of them guesses
the correct number, you lose. If they guess the wrong number, you
get to try and guess again.
</p>
</div>
<div class="list-item flex row">
<div class="circle flex">
<p class="list-number">5</p>
</div>
<p>
Once you or the bots answer the correct number, the game is over.
You can then choose to either play another game, or go back to the
main menu.
</p>
</div>
</div>
</div>
<div class="button-container">
<a href="./menu.html">
<button class="primary-button-lg">Got it!</button>
</a>
</div>
</main>
</body>
</html>