From 544e05069f3f6209551df07d1a0e911b8b350ee9 Mon Sep 17 00:00:00 2001
From: Sam Carlton <sam@sam.lc>
Date: Fri, 20 Nov 2020 16:17:32 -0600
Subject: [PATCH] Add games index page

---
 pages/games.vue | 93 +++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 93 insertions(+)
 create mode 100644 pages/games.vue

diff --git a/pages/games.vue b/pages/games.vue
new file mode 100644
index 0000000..cacf249
--- /dev/null
+++ b/pages/games.vue
@@ -0,0 +1,93 @@
+<template>
+    <section class="container py-24">
+        <div class="flex flex-col items-center">
+            <h1 class="title text-4xl md:text-6xl font-hairline leading-tight text-center">
+                Does it ARM?
+            </h1>
+            <h2 class="subtitle md:text-xl font-light text-center">
+                Games that are reported to support Apple Silicon
+            </h2>
+
+            <small class="opacity-75">
+                <span>Data generously provided by </span>
+                <span>
+                    <a
+                        href="https://twitter.com/__tosh"
+                        class="font-bold"
+                    >Thomas Schranz</a>
+                </span>
+                <span>via</span>
+                <span>
+                    <a
+                        href="https://docs.google.com/spreadsheets/d/1er-NivvuIheDmIKBVRu3S_BzA_lZT5z3Z-CxQZ-uPVs/edit#gid=0"
+                        class="font-bold"
+                    >Games and Apps on Apple Silicon</a>
+                </span>
+            </small>
+
+            <Search
+                :app-list="gameList"
+                :quick-buttons="quickButtons"
+                no-email-subscribe
+                @update:query="query = $event"
+            />
+
+            <LinkButton
+                :href="`https://docs.google.com/spreadsheets/d/1er-NivvuIheDmIKBVRu3S_BzA_lZT5z3Z-CxQZ-uPVs/edit#gid=0`"
+            >
+                Report a Game
+            </LinkButton>
+        </div>
+    </section>
+</template>
+
+<script>
+import Search from '~/components/search.vue'
+import LinkButton from '~/components/link-button.vue'
+
+import gameList from '~/game-list.json'
+
+export default {
+    components: {
+        Search,
+        LinkButton
+    },
+    data: function () {
+        return {
+            query: '',
+            quickButtons: [
+                {
+                    label: '✅ Full Native Support',
+                    query: 'status:native'
+                },
+                {
+                    label: '✳️ Rosetta',
+                    query: 'status:rosetta'
+                },
+                {
+                    label: '🚫 Unsupported',
+                    query: 'status:no'
+                }
+            ]
+        }
+    },
+    computed: {
+        gameList() {
+            return gameList
+        }
+    },
+    head() {
+        return {
+            title: `Games supported on Apple Silicon - Does it ARM`,
+            // meta: [
+            //     // hid is used as unique identifier. Do not use `vmid` for it as it will not work
+            //     {
+            //         hid: 'description',
+            //         name: 'description',
+            //         content: 'My custom description'
+            //     }
+            // ]
+        }
+    }
+}
+</script>