-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
61 lines (56 loc) · 2.23 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
59
60
61
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CandyHunt- Cook a Dessert</title>
<link rel="stylesheet" href="styles.css">
<!-- Favicon of the webpage -->
<link rel="icon" href="favicon.ico" type="image/x-icon">
</head>
<!-- Home Page -->
<body id="welcome-screen">
<section id="welcome-section">
<!-- to facilitate the animation -->
<div class="first-out">
<div class="welcome">
<!-- Welcome message -->
<h1>Welcome</h1>
</div>
<!-- General Introduction the scenario of the game -->
<div class="Introduction">
<p>Tiffi, a recent cooking college graduate, wants to whip up a delightful dessert for her guests.
However,
her kitchen is a mess, and she's in a hurry. To create the sweetest treats, she must match pairs of
candies in limited moves. Your task is to help Tiffi find the correct candy pairs, and see how much
the
guests love the desserts you both prepare.
<br> Approach her to enter the kitchen
</p>
</div>
<!-- Entering the game -->
<div class="welcome-img">
<img src="assets/Tiffitransparency.png" alt="TiffiWelcomesYou">
</div>
</div>
</section>
<section id="instructions-screen">
<div class="welcome">
<h1>Instructions</h1>
</div>
<div class="instructions-list">
<p>
1. There will be 16 hidden tiles on the screen arranged in a grid in Tiffi's kitchen. <br>
2. Click on any tile and it will reveal the candy. Click on the any other tile. <br>
3. If you found the other tile of the pair, you'll earn a point. <br>
4. Moves will be limited. Try to score the highest. <br>
5. Please everyone on the table and cook even tastier the next time.
</p>
</div>
<div class="button">
<button id="play"><a id= "playBtn" href="kitchen.html">Play</a></button>
</div>
</section>
<script src="animation.js"></script>
</body>
</html>