Fix all little bugs

This commit is contained in:
2020-12-16 15:17:24 +01:00
parent 0ca62a1923
commit 40510d69a5
11 changed files with 148 additions and 35 deletions

View File

@@ -121,7 +121,9 @@ export default {
},
async changeLanguage(lang) {
this.$i18n.setLocale(lang)
await this.$router.push('/')
if (this.$router.currentRoute.fullPath.includes('blog')) {
await this.$nuxt.refresh()
}
},
},
mounted() {

View File

@@ -1,7 +1,7 @@
<template>
<article
class="border-2 border-black border-solid rounded-xl w-full h-blog p-2 flex flex-col justify-between my-5 duration-200 transform hover:scale-95"
:style="{ backgroundImage: require(`@/assets/img/posts/${cover}.png`) }"
class="post border-2 border-black border-solid rounded-xl w-full h-blog p-2 flex flex-col justify-between my-5 duration-200 transform hover:scale-95"
:style="{ backgroundImage: `url(${this.getBackgroundUrl})` }"
>
<div>
<p
@@ -71,6 +71,9 @@ export default {
const dateFormat = this.date.split('-')
return dateFormat[0] + " " + this.$t('month.' + dateFormat[1]) + " " + dateFormat[2]
},
getBackgroundUrl() {
return require(`~/assets/img/posts/${this.cover}.png`)
}
}
}
</script>

View File

@@ -58,9 +58,9 @@ export default {
case 'rose':
return 'hover:bg-rose-400'
case 'black':
return 'hover:bg-black-400'
return 'hover:bg-black'
case 'white':
return 'hover:bg-white-400'
return 'hover:bg-white'
case 'pink':
return 'hover:bg-pink-400'
case 'fuchsia':

View File

@@ -67,9 +67,9 @@ export default {
case 'rose':
return 'hover:bg-rose-600'
case 'black':
return 'hover:bg-black-600'
return 'hover:bg-black'
case 'white':
return 'hover:bg-white-600'
return 'hover:bg-white'
case 'pink':
return 'hover:bg-pink-600'
case 'fuchsia':

View File

@@ -1,10 +1,10 @@
---
slug: new-version-new-website
title: Ouverture de la nouvelle version de mon site !
description: Après de long mois de développement, voici la version 2 de mon site !
title: Opening of the new version of my site!
description: After long months of development, here is version 2 of my site!
reading_time: 2
tags: ["tags.dev"]
cover: 'post-1'
cover: post-1
date: 13-12-2020
background: false
---

View File

@@ -4,7 +4,7 @@ title: Ouverture de la nouvelle version de mon site !
description: Après de long mois de développement, voici la version 2 de mon site !
reading_time: 2
tags: ["tags.dev"]
cover: 'post-1'
cover: post-1
date: 13-12-2020
background: false
---

View File

@@ -43,7 +43,7 @@
},
{
"title": "AdonisJs",
"color": "black",
"color": "lime",
"cover": "AdonisJs",
"slug": "adonisjs"
},

View File

@@ -1,11 +1,25 @@
[
{
"slug": "erisium",
"title": "Erisium",
"description": "works.erisium",
"url": "https://erisium.com",
"cover": "erisium",
"color": "fuchsia",
"skills": [
"java",
"git",
"redis",
"mariadb"
]
},
{
"slug": "artsite",
"title": "ArtSite",
"description": "works.artsite",
"url": "https://arthurdanjou.fr",
"cover": "artsite",
"color": "gray",
"color": "trueGray",
"skills": [
"typescript",
"nuxtjs",
@@ -35,20 +49,6 @@
"mariadb"
]
},
{
"slug": "erisium",
"title": "Erisium",
"description": "works.erisium",
"url": "https://erisium.com",
"cover": "erisium",
"color": "fuchsia",
"skills": [
"java",
"git",
"redis",
"mariadb"
]
},
{
"slug": "artclick",
"title": "ArtClick",

View File

@@ -37,7 +37,7 @@
</div>
<div class="w-full">
<div class="flex justify-center w-full h-auto">
<img class="w-full h-auto" :src="'http://localhost:5555/files/'+post.cover" alt="Cover Img" />
<img class="w-full h-auto" :src="require(`@/assets/img/posts/${post.cover}.png`)" alt="Cover Img" />
</div>
</div>
<nuxt-content
@@ -126,12 +126,12 @@ export default {
.catch(() => {
error({ statusCode: 404, message: "Post not found" });
});
const {data: likes} = await $axios.get(`posts/${params.slug}`)
const liked = 0 // await $axios.get(`posts/is/${params.slug}`)
//const {data: likes} = await $axios.get(`posts/${params.slug}`)
//const liked = 0 await $axios.get(`posts/is/${params.slug}`)
return {
post,
likes,
liked: 0//liked.data !== 0
likes: 0,
liked: true//liked.data !== 0
}
},
methods: {

View File

@@ -83,7 +83,7 @@
{{ $t('contact.available.start') }}
<span
class="py-1 px-2 font-bold rounded-xl"
:class="'bg-' +color+ '-200 text-' +color+ '-500'"
:class="getColor"
>
{{ $t('hiring.status.' + status) }}
</span>
@@ -138,6 +138,60 @@ export default {
}, 5000)
})
}
},
computed: {
getColor() {
switch (this.color) {
case 'red':
return 'bg-red-200 text-red-500'
case 'orange':
return 'bg-orange-200 text-orange-500'
case 'purple':
return 'bg-purple-200 text-purple-500'
case 'blue':
return 'bg-blue-200 text-blue-500'
case 'green':
return 'bg-green-200 text-green-500'
case 'yellow':
return 'bg-yellow-200 text-yellow-500'
case 'cyan':
return 'bg-cyan-200 text-cyan-500'
case 'teal':
return 'bg-teal-200 text-teal-500'
case 'amber':
return 'bg-amber-200 text-amber-500'
case 'blueGray':
return 'bg-blueGray-200 text-blueGray-500'
case 'emerald':
return 'bg-emerald-200 text-emerald-500'
case 'lightBlue':
return 'bg-lightBlue-200 text-lightBlue-500'
case 'lime':
return 'bg-lime-200 text-lime-500'
case 'rose':
return 'bg-rose-200 text-rose-500'
case 'black':
return 'bg-black text-black'
case 'white':
return 'bg-white text-white'
case 'pink':
return 'bg-pink-200 text-pink-500'
case 'fuchsia':
return 'bg-fuchsia-200 text-fuchsia-500'
case 'violet':
return 'bg-violet-200 text-violet-500'
case 'indigo':
return 'bg-indigo-200 text-indigo-500'
case 'warmGray':
return 'bg-warmGray-200 text-warmGray-500'
case 'trueGray':
return 'bg-trueGray-200 text-trueGray-500'
case 'gray':
return 'bg-gray-200 text-gray-500'
case 'coolGray':
return 'bg-coolGray-200 text-coolGray-500'
}
}
}
}
</script>

View File

@@ -16,10 +16,10 @@
</nuxt-link>
</div>
</div>
<img class="w-4/5 rounded-xl" :src="require(`@/assets/img/works/${work.cover}.png`)" alt="Project Img" />
<img class="w-72 rounded-xl" :src="require(`@/assets/img/works/${work.cover}.png`)" alt="Project Img" />
<a
class="mt-4 py-3 px-6 rounded-full cursor-pointer duration-300 mb-10 lg:mb-0"
:class="'bg-' + work.color + '-400 hover:bg-' + work.color + '-600'"
:class="getColor"
:href="work.url"
>{{work.url.replace('https://', '').replace('http://', '')}}</a>
</div>
@@ -81,6 +81,60 @@ export default {
work,
skills
}
},
computed: {
getColor() {
switch (this.work.color) {
case 'red':
return 'bg-red-400 hover:bg-red-600'
case 'orange':
return 'bg-orange-400 hover:bg-orange-600'
case 'purple':
return 'bg-purple-400 hover:bg-purple-600'
case 'blue':
return 'bg-blue-400 hover:bg-blue-600'
case 'green':
return 'bg-green-400 hover:bg-green-600'
case 'yellow':
return 'bg-yellow-400 hover:bg-yellow-600'
case 'cyan':
return 'bg-cyan-400 hover:bg-cyan-600'
case 'teal':
return 'bg-teal-400 hover:bg-teal-600'
case 'amber':
return 'bg-amber-400 hover:bg-amber-600'
case 'blueGray':
return 'bg-blueGray-400 hover:bg-blueGray-600'
case 'emerald':
return 'bg-emerald-400 hover:bg-emerald-600'
case 'lightBlue':
return 'bg-lightBlue-400 hover:bg-lightBlue-600'
case 'lime':
return 'bg-lime-400 hover:bg-lime-600'
case 'rose':
return 'bg-rose-400 hover:bg-rose-600'
case 'black':
return 'bg-black hover:bg-black'
case 'white':
return 'bg-white hover:bg-white'
case 'pink':
return 'bg-pink-400 hover:bg-pink-600'
case 'fuchsia':
return 'bg-fuchsia-400 hover:bg-fuchsia-600'
case 'violet':
return 'bg-violet-400 hover:bg-violet-600'
case 'indigo':
return 'bg-indigo-400 hover:bg-indigo-600'
case 'warmGray':
return 'bg-warmGray-400 hover:bg-warmGray-600'
case 'trueGray':
return 'bg-trueGray-400 hover:bg-trueGray-600'
case 'gray':
return 'bg-gray-400 hover:bg-gray-600'
case 'coolGray':
return 'bg-coolGray-400 hover:bg-coolGray-600'
}
}
}
}
</script>