This commit is contained in:
2021-07-03 17:27:35 +02:00
parent d3ea063e77
commit 2ac84ab39c
18 changed files with 264 additions and 77 deletions

View File

@@ -1,5 +1,5 @@
<template>
<main class="about flex flex-col items-center mb-8 px-5 xl:px-48">
<main class="flex flex-col items-center mb-8 px-5 xl:px-64">
<PageTitle title="part.about"/>
<PresentationAbout />
<SkillsAbout />

View File

@@ -31,7 +31,7 @@
<script lang="ts">
import {defineComponent, useAsync, useContext} from "@nuxtjs/composition-api";
import {Post} from "../../../types/types";
import {Post} from "~/types/types";
export default defineComponent({
name: "blog",

View File

@@ -1,7 +1,7 @@
<template>
<main class="contact flex flex-col items-center px-5 xl:px-48">
<PageTitle title="part.contact" />
<section class="w-full lg:w-3/4 mb-10 mt-4 text-center">
<main class="contact flex flex-col px-5 xl:px-64">
<PageTitle class="self-center" title="part.contact" />
<section class="w-full lg:w-3/4 mb-10 mt-4 text-justify">
<h1 class="font-bold text-gray-700 text-xl md:text-3xl my-4 dark:text-gray-400">
{{ $t('contact.why.title') }}
</h1>
@@ -9,7 +9,7 @@
{{ $t('contact.why.description') }}
</h3>
</section>
<section class="w-full lg:w-3/4 mb-10 mt-4 text-center">
<section class="w-full lg:w-3/4 mb-10 mt-4 text-justify">
<h1 class="font-bold text-gray-700 text-xl md:text-3xl my-4 dark:text-gray-400">
{{ $t('contact.available.title') }}
</h1>
@@ -22,13 +22,13 @@
{{ $t('contact.available.end') }}
</div>
</section>
<ContactForm />
<ContactForm class="w-full"/>
</main>
</template>
<script lang="ts">
import {computed, useAsync, useContext} from "@nuxtjs/composition-api";
import {InfoData} from "../../types/types";
import {InfoData} from "~/types/types";
export default {
name: "contact",

View File

@@ -1,7 +1,7 @@
<template>
<main class="flex flex-col items-center px-5 xl:px-48">
<main class="flex flex-col items-center px-5 xl:px-64">
<PageTitle title="part.env" />
<p class="text-gray-700 dark:text-gray-400 text-xl my-8">{{ $t('env.title.description') }}</p>
<p class="text-justify text-gray-700 dark:text-gray-400 text-xl my-8">{{ $t('env.title.description') }}</p>
<EnvGroup>
<EnvTitle title="env.title.ide">
<DevelopmentIcon />

85
src/pages/guestbook.vue Normal file
View File

@@ -0,0 +1,85 @@
<template>
<main v-if="guestbook_messages" class="flex flex-col mb-8 px-5 xl:px-64">
<PageTitle class="self-center" title="part.guestbook"/>
<section @click="log" class="flex flex-col 2xl:flex-row items-center py-8">
<div class="ml-2 text-lg leading-6 text-justify dark:text-gray-400 text-gray-700">
<p>{{ $t('guestbook.description') }}</p>
</div>
</section>
<section class="md:w-2/3 p-6 border border-indigo-300 dark:border-indigo-700 rounded-lg text-justify">
<h1 class="text-black font-bold dark:text-white text-2xl">{{ $t('guestbook.signin') }}</h1>
<h3 class="text-gray-500 dark:text-gray-400">{{ $t('guestbook.share') }}</h3>
<div class="flex space-x-4 my-3">
<div class="icon-parent flex justify-center items-center p-2 border border-black dark:border-white duration-300 cursor-pointer">
<GoogleIcon />
</div>
<div class="icon-parent flex justify-center items-center p-2 border border-black dark:border-white duration-300 cursor-pointer">
<GithubIcon />
</div>
<div class="icon-parent flex justify-center items-center p-2 border border-black dark:border-white duration-300 cursor-pointer">
<TwitterIcon />
</div>
</div>
<p class="text-sm text-gray-700 dark:text-gray-300">{{ $t('guestbook.infos') }}</p>
</section>
<section class="flex flex-col 2xl:flex-row justify-center items-center py-8">
FETCH messages
{{ guestbook_messages }}
</section>
</main>
</template>
<script lang="ts">
import {defineComponent, ref, useAsync, useContext} from "@nuxtjs/composition-api";
interface GuestbookMessage {
message: string,
author: string,
date: string
}
export default defineComponent({
name: "guestbook",
head() {
return {
title: `${this.$i18n.t('header.guestbook')} - Arthur Danjou`
}
},
setup() {
const { $axios } = useContext()
const guestbook_messages = ref([])
useAsync(async () => {
await $axios.get('guestbook', {
headers: {
'Authorization': `Bearer ${process.env.API_TOKEN}`
}
})
.then(response => {
guestbook_messages.value = response.data.guestbook_messages
})
.catch(error => {
console.log("error", error)
})
})
const log = () => {
console.log(guestbook_messages)
}
return {
guestbook_messages,
log
}
}
})
</script>
<style scoped lang="scss">
.icon-parent svg {
@apply duration-300;
}
.icon-parent:hover svg {
@apply transform scale-110;
}
</style>

View File

@@ -22,16 +22,18 @@
</template>
<script lang="ts">
import {useAsync, useContext, useMeta} from "@nuxtjs/composition-api";
import {Project} from "../../types/types";
import {defineComponent, useAsync, useContext} from "@nuxtjs/composition-api";
import {Project} from "~/types/types";
export default {
export default defineComponent({
name: "index",
head: {
title: `Projects - Arthur Danjou`
head() {
return {
title: `${this.$i18n.t('header.projects')} - Arthur Danjou`
}
},
setup() {
const { $content, i18n, $sentry } = useContext()
const { $content, $sentry } = useContext()
const projects = useAsync(() => {
return $content('projects')
@@ -41,13 +43,9 @@ export default {
})
})
useMeta( {
title: `${i18n.t('header.projects')} - Arthur Danjou`
})
return {
projects
}
}
}
})
</script>