From 3bec84b81ff0d9e531c03c9e82334c42971f6248 Mon Sep 17 00:00:00 2001
From: Sam Carlton <sam@sam.lc>
Date: Sat, 19 Sep 2020 16:47:32 -0500
Subject: [PATCH] Use default layout as layout component

---
 components/layout.vue | 18 ------------
 layouts/default.vue   | 50 +++++++++++++--------------------
 pages/index.vue       | 64 ++++++++++++++++++++-----------------------
 3 files changed, 49 insertions(+), 83 deletions(-)
 delete mode 100644 components/layout.vue

diff --git a/components/layout.vue b/components/layout.vue
deleted file mode 100644
index 33af7f4..0000000
--- a/components/layout.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<template>
-    <div class="app-wrapper text-gray-300 bg-gray-800">
-        <Navbar />
-        <div class="app-main min-h-screen flex items-center">
-            <slot />
-        </div>
-    </div>
-</template>
-
-<script>
-import Navbar from '~/components/navbar.vue'
-
-export default {
-    components: {
-        Navbar
-    }
-}
-</script>
diff --git a/layouts/default.vue b/layouts/default.vue
index abe4b50..59f6016 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -1,12 +1,28 @@
 <template>
-    <div>
-        <nuxt/>
+    <div class="app-wrapper text-gray-300 bg-gray-800">
+        <Navbar />
+        <div class="app-main min-h-screen flex items-center">
+            <nuxt />
+        </div>
     </div>
 </template>
 
+<script>
+import 'typeface-inter/inter.css'
+
+import Navbar from '~/components/navbar.vue'
+
+export default {
+    components: {
+        Navbar
+    }
+}
+
+</script>
+
 <style>
 html {
-    font-family: 'Source Sans Pro', -apple-system, BlinkMacSystemFont,
+    font-family: 'Inter', -apple-system, BlinkMacSystemFont,
         'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
     font-size: 16px;
     word-spacing: 1px;
@@ -24,32 +40,4 @@ html {
     margin: 0;
 }
 
-.button--green {
-    display: inline-block;
-    border-radius: 4px;
-    border: 1px solid #3b8070;
-    color: #3b8070;
-    text-decoration: none;
-    padding: 10px 30px;
-}
-
-.button--green:hover {
-    color: #fff;
-    background-color: #3b8070;
-}
-
-.button--grey {
-    display: inline-block;
-    border-radius: 4px;
-    border: 1px solid #35495e;
-    color: #35495e;
-    text-decoration: none;
-    padding: 10px 30px;
-    margin-left: 15px;
-}
-
-.button--grey:hover {
-    color: #fff;
-    background-color: #35495e;
-}
 </style>
diff --git a/pages/index.vue b/pages/index.vue
index 8b610b4..ff2276b 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -1,49 +1,45 @@
 <template>
-    <Layout>
-        <section class="container">
-            <div>
-                <logo/>
-                <h1 class="title">
-                    Does it ARM
-                </h1>
-                <h2 class="subtitle">
-                    Apps that are reported to support ARM on macOS
-                </h2>
-                <div class="apps">
-                    <div
-                        v-for="app in appList"
-                        :key="app.slug"
-                    >
-                        <a :href="`/app/${app.slug}`">
-                            <div>
-                                {{ app.name }}
-                            </div>
-                        </a>
-                    </div>
-                    <a
-                        href="https://nuxtjs.org/"
-                        target="_blank"
-                        class="button--green">Documentation</a>
-                    <a
-                        href="https://github.com/nuxt/nuxt.js"
-                        target="_blank"
-                        class="button--grey">GitHub</a>
+    <section class="container">
+        <div>
+            <logo/>
+            <h1 class="title">
+                Does it ARM
+            </h1>
+            <h2 class="subtitle">
+                Apps that are reported to support ARM on macOS
+            </h2>
+            <div class="apps">
+                <div
+                    v-for="app in appList"
+                    :key="app.slug"
+                >
+                    <a :href="`/app/${app.slug}`">
+                        <div>
+                            {{ app.name }}
+                        </div>
+                    </a>
                 </div>
+                <a
+                    href="https://nuxtjs.org/"
+                    target="_blank"
+                    class="button--green">Documentation</a>
+                <a
+                    href="https://github.com/nuxt/nuxt.js"
+                    target="_blank"
+                    class="button--grey">GitHub</a>
             </div>
-        </section>
-    </Layout>
+        </div>
+    </section>
 </template>
 
 <script>
 import Logo from '~/components/Logo.vue'
-import Layout from '~/components/layout.vue'
 
 import appList from '~/assets/app-list.json'
 
 export default {
     components: {
-        Logo,
-        Layout
+        Logo
     },
     computed: {
         appList() {