-
Notifications
You must be signed in to change notification settings - Fork 2
/
list.html
45 lines (42 loc) · 1.9 KB
/
list.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
<!DOCTYPE html>
<html>
<head>
<!-- Google Analytics -->
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-73203609-3', 'auto');
ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<!-- End Google Analytics -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Command Line Heroes ARCADE</title>
<link rel="stylesheet" href="list.css">
</head>
<body>
<div id="arcade-list-container">
<div class="game-wrapper" v-for="game in games" v-bind:class="{ banner: !!game.banner }">
<div class="banner" v-if="game.banner"><h2 v-html=game.banner></h2></div>
<pfe-card v-if="game.path" color=darkest style="height: 100%">
<a pfe-overflow="top right left" v-if="game.thumb" tabindex="-1" v-on:click="nav" v-bind:data-href="game.path">
<img class="" v-bind:src="game.thumb">
</a>
<div slot="pfe-card--footer" class="msg">
<h1>{{ game.name }}</h1>
<p>by <a target=_blank v-bind:href="game.authorurl">{{ game.author }}</a></p>
<p v-if=game.placement><pfe-icon v-bind:class="{ place1: game.placement==1, place2: game.placement==2, place3: game.placement==3 }" icon="fas-trophy" size="2x"></pfe-icon> <b><pfe-number type="ordinal">{{ game.placement }}</pfe-number></b> place at Open Jam 2019</p>
<p v-html=game.msg></p>
</div>
<div slot="pfe-card--footer">
<div class="beside">
<p><pfe-cta><a target="_blank" v-bind:href="game.repo">VIEW SOURCE</a></pfe-cta> </pfe-cta></p>
<p><pfe-cta pfe-priority=primary><a v-on:click="nav" v-bind:data-href="game.path">PLAY</a></pfe-cta> </pfe-cta></p>
</div>
</div>
</pfe-card>
</div>
</div>
<script type=module src="dist/list.js"></script>
</body>
</html>