/
index.html
108 lines (81 loc) · 3.46 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
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
101
102
103
104
105
106
107
108
<html>
<head>
<title>Cosmic Bubble</title>
<link rel="icon" type="image/png" href="https://res.cloudinary.com/deeptailor/image/upload/c_scale,w_250/v1479421462/planet-icon_b2vcgm.ico">
<link rel="stylesheet" href="assets/reset.css" />
<link rel="stylesheet" href="assets/cosmic-bubble.css" />
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Righteous" rel="stylesheet">
</head>
<body>
<div id="fb-root"></div>
<canvas id="myCanvas">
</canvas>
<div class="start-screen">
<div class="game-title">C<span class="name-o">O</span>SMIC BUBBLE</div>
<div class="introduction">
<h1> 1: Introduction </h1>
<p>
Goal: Absorb smaller bubbles to become the biggest bubble in the galaxy! <br/>
</p>
<img class="arrows" src="https://res.cloudinary.com/deeptailor/image/upload/c_crop,h_130,w_175/v1480624715/arrow-keys_vwxg2w.png"></img>
<h3>Or W,A,S,D to move</h3>
<div class="how">
<h1> 2: How </h1>
<p>
Maneuver your bubble to absorb the smaller bubbles and watch your bubble grow.
Beware of the bigger bubbles, touch them and they will eat you!
</p>
</div>
<div class="levels">
<h1> 3: Levels </h1>
<p>
When you absorb the second last bubble, you move on to the next level!
Remember enemy bubbles get faster at every level!
</p>
</div>
</div>
<div class="start-game">Start Game</div>
<div class="contact-container">
<div class="contact-icons">
<a href="https://www.github.com/dtailor90">
<img src="https://res.cloudinary.com/deeptailor/image/upload/v1478383625/logos/GitHub-Mark-Light-120px-plus_x9kzyx.png"/>
</a>
<a href="https://www.linkedin.com/in/deeptailor">
<img src="https://res.cloudinary.com/deeptailor/image/upload/v1478383632/logos/In-White-128px-TM_uk1amf.png"/>
</a>
<a href="mailto:deeptailor@gmail.com">
<img src="https://res.cloudinary.com/deeptailor/image/upload/v1479428396/envelope_fovcdv.svg"/>
</a>
</div>
<div class="contact-name">Designed and Developed by Deep Tailor</div>
<div class="game-name-contact"> COSMIC BUBBLE®</div>
</div>
</div>
<div class="level">Level: 1</div>
<div class="score">Score: 0</div>
<div class="overlay">
<div class="game-name">COSMIC BUBBLE</div>
<div class="paused">PAUSED
<div class="instructions">Press Enter to Play</div>
</div>
</div>
<div class="you-win">
<div class="game-name">COSMIC BUBBLE</div>
<div class="congratulations">Congratulations, You Win!</div>
<div class="restart"><i class="material-icons">replay</i> Play Again</div>
<div class="share-buttons">
<!-- AddToAny BEGIN -->
<div class="a2a_kit a2a_kit_size_32 a2a_default_style">
<a class="a2a_dd" href="https://www.addtoany.com/share"></a>
<a class="a2a_button_facebook"></a>
<a class="a2a_button_twitter"></a>
<a class="a2a_button_google_plus"></a>
</div>
<script async src="https://static.addtoany.com/menu/page.js"></script>
<!-- AddToAny END -->
</div>
</div>
<script type="application/javascript" src="lib/bundle.js"></script>
</body>
</html>