Files
website-old/src/pages/projects.vue
2021-07-02 18:02:14 +02:00

54 lines
1.6 KiB
Vue
Executable File

<template>
<main v-if="projects" class="work flex flex-col items-center">
<PageTitle title="part.projects" />
<h1 v-if="projects.length === 0" class="text-xl font-bold text-center my-8 w-full">{{ $t('projects.no_project') }}</h1>
<div v-else class="flex flex-col justify-around items-center py-10 w-full">
<h1 class="text-gray-700 dark:text-gray-400 text-xl mt-4">{{ $t('projects.description') }}</h1>
<div class="flex flex-col items-center md:items-start md:flex-row flex-wrap w-full space-y-3 md:space-y-0">
<div class="flex py-8 w-full flex-wrap justify-center">
<div class="md:mx-8 my-4 w-full lg:w-auto" v-for="project in projects">
<Project
:title="project.title"
:cover="project.cover"
:description="project.description"
:tags="project.tags"
:url="project.url"
/>
</div>
</div>
</div>
</div>
</main>
</template>
<script lang="ts">
import {useAsync, useContext, useMeta} from "@nuxtjs/composition-api";
import {Project} from "../../types/types";
export default {
name: "index",
head: {
title: `Projects - Arthur Danjou`
},
setup() {
const { $content, i18n, $sentry } = useContext()
const projects = useAsync(() => {
return $content('projects')
.fetch<Project>()
.catch((error) => {
$sentry.captureEvent(error)
})
})
useMeta( {
title: `${i18n.t('header.projects')} - Arthur Danjou`
})
return {
projects
}
}
}
</script>