-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
58 lines (58 loc) · 2.11 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link
href="https://fonts.googleapis.com/css?family=Montserrat|Varela+Round&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="style.css" />
<title>Simple Simon</title>
</head>
<body>
<h1 class="title">Simple Simon</h1>
<div class="score scores">
SCORE:<span class="scores-num" id="score-num">0</span>
</div>
<div class="highscore scores">
HIGHSCORE:<span class="scores-num" id="highscore-num">0</span>
</div>
<button class="instructions-button">INSTRUCTIONS</button>
<div class="instructions">
<p class="instructions-head">INSTRUCTIONS</p>
<p class="instructions-text">
Welcome to Simon! Simon is a memory game in which you match colors with
Simon.<br /><br />To play, press start, and wait for Simon to light up a
button. Press the same buttton as Simon and then wait for Simon to light
up the first button, with an additional button immediately after.<br /><br />Each
round you will have to press the buttons in the correct order, and after
each correct attempt, Simon will add another to the sequence. You lose
when your sequence doesn't match Simon's.<br /><br />Good luck!
</p>
</div>
<div class="loser-message">
<p class="loser-head">You Lose!</p>
<p class="loser-text">Please press start to try again.</p>
</div>
<div class="game-board">
<div class="game-buttons">
<div class="green-button">
<div class="cover-green"></div>
</div>
<div class="red-button">
<div class="cover-red"></div>
</div>
<div class="yellow-button">
<div class="cover-yellow"></div>
</div>
<div class="blue-button">
<div class="cover-blue"></div>
</div>
</div>
</div>
<button class="start-button">START</button>
<script src="script.js"></script>
</body>
</html>