forked from fossasia/labyrinth
-
Notifications
You must be signed in to change notification settings - Fork 0
/
howtoplay.html
54 lines (51 loc) · 2.83 KB
/
howtoplay.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
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet" href="css/stylesheet.css">
<meta charset="utf-8">
<title>How to play</title>
<meta name="description" content="Step-by-step guide to play Labyrinth game">
<meta name="author" content="Ploypiti P.">
<link href="https://fonts.googleapis.com/css?family=Playfair+Display" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">
</head>
<body>
<div class="whitespace">
<center>
<div class="header">
<img class="play-button" src="images/docs/play-button.png" height="50">
<h1 class="site_title">How to play</h1>
<p class="site_description">Fossasia Labyrinth</p>
</div>
<div class="content">
<h3>Let's start</h3>
<p>You'll see the base room with doors on it's walls. Notice the red and grey tile, there are 3 doors/openings on 3 walls.</p>
<img src="images/docs/how-to-play-1.jpg" width="50%">
<h2>2.</h2>
<p>Press the upward arrow button to create a room above the current room (precisely, top left corner of your screen or north-west direction taking north towards the top of your screen)
</p>
<img src="images/docs/how-to-play-2.jpg" width="50%">
<h2>3.</h2>
<p>Now you can see a new block/room added. Also see that the color difference of the tiles. The bring red shows the current (red) active tile and the dark (black) tile shows the rest of tiles. Let's move a bit towards right now <code>press right arrow</code></p>
<img src="images/docs/how-to-play-3.jpg" width="50%">
<h2>4.</h2>
<p>We can see the tiles to the right (top-right precisely). We can see the doors towards all sides/walls of the room/block. so let's move more in the game.</p>
<img src="images/docs/how-to-play-4.jpg" width="50%">
<h2>5.</h2>
<p>We can see that there's no tile towards the top, so now we cannot move more in that direction. Let's go about making a complete grid. Do you see a way now too ? There is still an open door to explore!</p>
<img src="images/docs/how-to-play-5.jpg" width="50%">
<img src="images/docs/how-to-play-6.jpg" width="50%">
<h2>All done!</h2>
<p>Now it's your turn to explore, you can also contribute & create your own tiles.</p>
</div>
</div>
<div>
<a href="http://rawgit.com/fossasia/labyrinth/master/index.html"><button class="play">Play</button></a>
<p class="credits">Icons by flaticon.com</a>
</p>
</div>
</div>
</center>
</body>
</html>