-
Notifications
You must be signed in to change notification settings - Fork 67
/
index.html
135 lines (130 loc) · 5.53 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
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Arrow hero</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<meta name="description"
content="A minimalist game where your goal is to match a continuous, unstoppable stream of arrows."/>
<meta name="twitter:card" content="summary">
<meta name="twitter:image" content="https://acelisweaven.github.io/arrow-hero/assets/apple-touch-startup-image-1136x640.png"/>
<meta name="twitter:description"
content="A minimalist game where your goal is to match a continuous, unstoppable stream of arrows."/>
<meta property="og:title" content="Play Arrow hero"/>
<meta property="og:type" content="game"/>
<meta property="og:description"
content="A minimalist game where your goal is to match a continuous, unstoppable stream of arrows."/>
<meta property="og:image" content="https://acelisweaven.github.io/arrow-hero/assets/apple-touch-startup-image-1136x640.png"/>
<meta property="og:url" content="https://acelisweaven.github.io/arrow-hero/"/>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-64620538-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-64620538-1');
</script>
</head>
<body>
<div class="fullscreen-container">
<h1>Arrow hero</h1>
<h3 class="points-container"><span class="points">0</span> points</h3>
<div class="container">
<div class="key-selector-container">
<div class="key-selector">
<!--<div class="ding">+15</div>-->
</div>
</div>
<div class="keys-container">
<!--<div class="key key-up"></div>-->
</div>
<div class="helper-container">
<div class="top"></div>
<div class="bottom">
<div class="key key-left helper"></div>
<div class="key key-up helper"></div>
<div class="key key-right helper"></div>
<div class="key key-down helper"></div>
<div class="text desktop-only">
Press a key to begin
</div>
<div class="text not-desktop">
Touch a key to begin
</div>
</div>
</div>
<div class="total">
<div class="percent" style="width: 0"></div>
</div>
<div class="level-message">Placeholder message</div>
<div class="results">
<div class="results-container">
<div class="results-content">
<img src="images/arrow-hero.svg" alt="Arrow Hero" class="img-logo"/>
<h3>You've made...</h3>
<h2><span class="points">0</span> points</h2>
<br/>
<p class="desktop-only">Press <strong>Space</strong> to restart</p>
<p class="not-desktop">Touch <em>Restart</em> to try again</p>
</div>
</div>
</div>
<div class="pause">
<div class="pause-container">
<div class="pause-content">
<img src="images/arrow-hero.svg" alt="Arrow Hero" class="img-logo"/>
<h3>Paused</h3>
<br/>
<p class="desktop-only">Press <strong>Space</strong> to resume</p>
<p class="not-desktop">Touch <em>Pause</em> again to resume</p>
</div>
</div>
</div>
</div>
<div class="mobile-controls">
<div class="top">
<div class="key-up"></div>
</div>
<div class="bottom">
<div class="key-left"></div>
<div class="key-down"></div>
<div class="key-right"></div>
</div>
<div class="pause-btn">Pause</div>
</div>
<div class="best" style="display: none">
Best: <span class="best-points"><span class="value">0</span> points</span>
</div>
<div class="fullscreen-btn">
<a id="toggle-fullscreen">Toggle fullscreen</a>
</div>
</div>
<a class="banner" href="https://acelis.itch.io/inkys-pandemonium">
<img src="images/inkys-pandemonium-banner.jpg" alt="Play Inky's Pandemonium">
</a>
<div class="about">
<h2><i class="fa fa-info-circle"></i> About this game</h2>
<p>
<span class="prim">Arrow hero</span> is a minimalist game where your goal is to match a continuous, <span
class="third">unstoppable stream of arrows</span> using your <span class="sec">keyboard keys</span>.
</p>
<p>
This means that if you have more than one consecutive <span class="key-up"></span>
you only have to press <span class="key-up"></span> once to validate both.
</p>
<p class="desktop-only">
You can pause the game by pressing <strong>Space</strong>.<br/>
This game is <span class="third">mobile friendly</span>.
</p>
<h2><i class="fa fa-heart"></i> Sharing is caring</h2>
<p>If you liked this game, please share it!</p>
<h2><i class="fa fa-check-circle"></i> Steal this game</h2>
<p>
Feel free to <a href="https://github.com/AcelisWeaven/arrow-hero">fork me on GitHub</a>.
</p>
<hr/>
<p class="footer">Arrow Hero 2015 - <span data-current-year></span></p>
<p class="footer">A game created by Jeremy Graziani</p>
</div>
</body>
</html>