Buck9195/doesitarm
1
0
Fork 0
mirror of https://github.com/ThatGuySam/doesitarm.git synced 2026-05-18 06:44:46 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

Use layout on index page

Browse source
This commit is contained in:
Sam Carlton 2020-09-19 16:18:48 -05:00
parent fe6558b391
commit 29fb968760
1 changed files with 34 additions and 69 deletions
Download patch file Download diff file Expand all files Collapse all files

103
pages/index.vue
View file

@ -1,45 +1,49 @@
<template>
<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>
<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>
</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>
</div>
</section>
</section>
</Layout>
</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
Logo,
Layout
},
computed: {
appList() {
@ -48,42 +52,3 @@ export default {
}
}
</script>
<style>
/* Sample `apply` at-rules with Tailwind CSS
.container {
@apply min-h-screen flex justify-center items-center text-center mx-auto;
}
*/
.container {
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
}
.title {
font-family: 'Quicksand', 'Source Sans Pro', -apple-system,
BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
sans-serif;
display: block;
font-weight: 300;
font-size: 100px;
color: #35495e;
letter-spacing: 1px;
}
.subtitle {
font-weight: 300;
font-size: 42px;
color: #526488;
word-spacing: 5px;
padding-bottom: 15px;
}
.links {
padding-top: 15px;
}
</style>