mirror of
https://github.com/ArthurDanjou/website-old.git
synced 2026-01-14 12:14:42 +01:00
💻 | Working
This commit is contained in:
@@ -32,7 +32,7 @@ const i18n = {
|
||||
|
||||
const content = {
|
||||
apiPrefix: 'api',
|
||||
nestedProperties: ['categories.slug'],
|
||||
nestedProperties: ['skills.slug'],
|
||||
markdown: {
|
||||
prism: {
|
||||
theme: 'prism-themes/themes/prism-darcula.css'
|
||||
|
||||
|
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
@@ -4,7 +4,7 @@
|
||||
<nuxt-link to="/uses" class="h-48 md:w-1/3">
|
||||
<Ad color="rose" class="h-full w-full flex flex-col justify-between">
|
||||
<div>
|
||||
<h1 class="font-bold text-black text-3xl">
|
||||
<h1 class="font-bold text-black text-4xl">
|
||||
Usages
|
||||
</h1>
|
||||
<p class="text-lg text-gray-700 mt-4">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<nuxt-link :to="`/blog/${slug}`">
|
||||
<div class="rounded-lg shadow-lg h-116 w-full lg:w-100 text-left dark:bg-gray-800 transform hover:scale-103 duration-300 mb-8 lg:mb-0">
|
||||
<div class="rounded-lg shadow-xl h-116 w-full lg:w-100 text-left dark:bg-gray-800 transform hover:scale-103 duration-300 mb-8 lg:mb-0">
|
||||
<div class="h-2/5 post rounded-t-lg"
|
||||
:style="{ backgroundImage: `url(${getBackgroundCover})` }">
|
||||
</div>
|
||||
|
||||
@@ -1,17 +1,21 @@
|
||||
<template>
|
||||
<nuxt-link :to="`/projects/${slug}`">
|
||||
<div class="rounded-lg shadow-lg w-full md:w-72 text-left dark:bg-gray-800 transform hover:scale-103 duration-300 mb-4 lg:mb-0">
|
||||
<div class="h-40 post rounded-t-lg"
|
||||
:style="{ backgroundImage: `url(${getBackgroundCover})` }">
|
||||
<div class="rounded-lg shadow-xl h-94 w-full lg:w-84 text-left dark:bg-gray-800 transform hover:scale-103 duration-300 mb-8 lg:mb-0">
|
||||
<div class="h-2/5 post rounded-t-lg flex justify-center">
|
||||
<img :src="getCover" alt="Project Image" class="h-full"/>
|
||||
</div>
|
||||
<div class="p-4 flex flex-col justify-between">
|
||||
<h1 class="text-xl font-bold">
|
||||
{{ title }}
|
||||
</h1>
|
||||
<div class="flex space-x-2 mt-2">
|
||||
<div v-for="tag in tags">
|
||||
<Tag :content="tag" :pill="false"/>
|
||||
<div class="h-3/5 p-4 flex flex-col justify-between">
|
||||
<div>
|
||||
<div class="flex space-x-2 mb-2">
|
||||
<div v-for="tag in tags">
|
||||
<Tag :content="tag" :pill="false"/>
|
||||
</div>
|
||||
</div>
|
||||
<h1 class="text-2xl font-bold">{{ title }}</h1>
|
||||
<p class="text-base mt-3 text-gray-700 dark:text-gray-400 text-justify">{{ $t(description) }}</p>
|
||||
</div>
|
||||
<div class="flex justify-between">
|
||||
<h5 class="text-base text-gray-700 dark:text-gray-400">{{ company }}</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -24,11 +28,11 @@ import {computed} from "@nuxtjs/composition-api";
|
||||
|
||||
interface ProjectProp {
|
||||
title: string,
|
||||
description: string,
|
||||
cover: string,
|
||||
slug: string,
|
||||
color: string,
|
||||
url: string
|
||||
company: string,
|
||||
tags: Array<String>,
|
||||
description: string,
|
||||
}
|
||||
|
||||
export default {
|
||||
@@ -46,9 +50,13 @@ export default {
|
||||
type: String,
|
||||
default: "slug"
|
||||
},
|
||||
color: {
|
||||
description: {
|
||||
type: String,
|
||||
default: "red"
|
||||
default: "Description"
|
||||
},
|
||||
company: {
|
||||
type: String,
|
||||
default: "Company"
|
||||
},
|
||||
tags: {
|
||||
type: Array,
|
||||
@@ -56,10 +64,10 @@ export default {
|
||||
}
|
||||
},
|
||||
setup(props: ProjectProp) {
|
||||
const getBackgroundCover = computed(() => require(`@/assets/images/works/artapi.png`))
|
||||
const getCover = computed(() => require(`@/assets/images/projects/${props.cover}`))
|
||||
|
||||
return {
|
||||
getBackgroundCover
|
||||
getCover
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -69,6 +77,7 @@ export default {
|
||||
.project {
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
@apply bg-opacity-50;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -13,9 +13,11 @@
|
||||
<div v-for="project in projects">
|
||||
<Project
|
||||
:title="project.title"
|
||||
:description="project.description"
|
||||
:color="project.color"
|
||||
:cover="project.cover"
|
||||
:description="project.description"
|
||||
:slug="project.slug"
|
||||
:tags="project.tags"
|
||||
:company="project.company"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -16,20 +16,20 @@
|
||||
<div class="flex justify-center w-full md:w-1/2">
|
||||
<div class="flex flex-col space-y-6 w-full">
|
||||
<StrategyPart
|
||||
title="#1. Brainstorming"
|
||||
description="Je realise blablabla Je realise blablabla Je realise blablabla Je realise blablabla"
|
||||
title="home.strategy.1.title"
|
||||
description="home.strategy.1.description"
|
||||
/>
|
||||
<StrategyPart
|
||||
title="#2. Conception"
|
||||
description="Je realise blablabla"
|
||||
title="home.strategy.2.title"
|
||||
description="home.strategy.2.description"
|
||||
/>
|
||||
<StrategyPart
|
||||
title="#3. Developpement"
|
||||
description="Je realise blablabla"
|
||||
title="home.strategy.3.title"
|
||||
description="home.strategy.3.description"
|
||||
/>
|
||||
<StrategyPart
|
||||
title="#4. Livraison"
|
||||
description="Je realise blablabla"
|
||||
title="home.strategy.4.title"
|
||||
description="home.strategy.4.description"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<div>
|
||||
<h1 class="font-bold text-2xl">
|
||||
{{ title }}
|
||||
{{ $t(title) }}
|
||||
</h1>
|
||||
<p class="text-gray-700 dark:text-gray-400 text-base text-justify">
|
||||
{{ description }}
|
||||
{{ $t(description) }}
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -28,7 +28,7 @@ export default {
|
||||
blog: 'My Blog',
|
||||
work: 'My Work',
|
||||
contact: 'Contact me',
|
||||
about_description: 'Learn more about me, how I work and who I am',
|
||||
about_description: 'Learn more about me, how I projects and who I am',
|
||||
blog_description: 'I write articles about my life, development and my passions',
|
||||
work_description: 'Discover my creations to get an idea of my skills',
|
||||
contact_description: 'Find all my social networks to contact me'
|
||||
@@ -40,6 +40,24 @@ export default {
|
||||
hello: 'Hello, I am',
|
||||
description: 'I am a {age} year old self-taught developer. I live in Paris 🇫🇷. I love creating more or less useful applications and software. I use modern technologies to get the best possible result ✨',
|
||||
},
|
||||
strategy: {
|
||||
1: {
|
||||
title: '#1. Brainstorming',
|
||||
description: 'Test 1'
|
||||
},
|
||||
2: {
|
||||
title: '#2. Design',
|
||||
description: 'Test 2'
|
||||
},
|
||||
3: {
|
||||
title: '#3. Development',
|
||||
description: 'Test 3'
|
||||
},
|
||||
4: {
|
||||
title: '#4. Delivery',
|
||||
description: 'Test 4'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
blog: {
|
||||
@@ -154,13 +172,13 @@ export default {
|
||||
},
|
||||
how_to: {
|
||||
title: 'How to contact me? ✉',
|
||||
description: 'Please don\'t hesitate to contact me if you have any questions, think we could work together or if you just want to chat ✌️'
|
||||
description: 'Please don\'t hesitate to contact me if you have any questions, think we could projects together or if you just want to chat ✌️'
|
||||
},
|
||||
available: {
|
||||
title: 'Am I available? 🚩',
|
||||
description: 'This status will be updated in real time to let you know if I am available for work.',
|
||||
description: 'This status will be updated in real time to let you know if I am available for projects.',
|
||||
start: 'I am currently',
|
||||
end: 'for work'
|
||||
end: 'for projects'
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@@ -26,11 +26,12 @@ export default {
|
||||
part: {
|
||||
about: 'A Propos',
|
||||
blog: 'Mon Blog',
|
||||
work: 'Mon Travail',
|
||||
projects: 'Mes Projets',
|
||||
contact: 'Me Contacter',
|
||||
uses: 'Mes Usages',
|
||||
about_description: 'Apprenez en plus à mon propos, comment je travaille et qui je suis',
|
||||
blog_description: 'Je rédige des articles concernant ma vie, le développement et mes passions',
|
||||
work_description: 'Découvrez mes créations pour avoir une idée de mes compétences',
|
||||
projects_description: 'Découvrez mes créations pour avoir une idée de mes compétences',
|
||||
contact_description: 'Retrouvez tous mes réseaux sociaux pour me contacter'
|
||||
},
|
||||
|
||||
@@ -40,6 +41,24 @@ export default {
|
||||
hello: 'Bonjour, je suis',
|
||||
description: 'Je suis un jeune développeur autodidacte de {age} ans. J\'habite à Paris 🇫🇷. J\'adore créer des applications et des logiciels plus ou moins utiles. J\'utilise des technologies modernes pour obtenir le meilleur résultat possible ✨',
|
||||
},
|
||||
strategy: {
|
||||
1: {
|
||||
title: '#1. Brainstorming',
|
||||
description: 'Test 1'
|
||||
},
|
||||
2: {
|
||||
title: '#2. Conception',
|
||||
description: 'Test 2'
|
||||
},
|
||||
3: {
|
||||
title: '#3. Developpement',
|
||||
description: 'Test 3'
|
||||
},
|
||||
4: {
|
||||
title: '#4. Livraison',
|
||||
description: 'Test 4'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
blog: {
|
||||
@@ -132,8 +151,8 @@ export default {
|
||||
}
|
||||
},
|
||||
|
||||
work: {
|
||||
no_work: 'Malheureusement il n\'y a pas encore de projets disponibles. Reviens plus tard 😉',
|
||||
projects: {
|
||||
no_project: 'Malheureusement il n\'y a pas encore de projets disponibles. Reviens plus tard 😉',
|
||||
description: 'Voici les différents projets auxquels j\'ai pu participer dans mon passé !',
|
||||
tech_used: 'Listes des compétences utilisées',
|
||||
go_back: 'Retour en arrière'
|
||||
|
||||
@@ -19,12 +19,17 @@
|
||||
|
||||
<script lang="ts">
|
||||
|
||||
import {useContext, useMeta} from "@nuxtjs/composition-api";
|
||||
|
||||
export default {
|
||||
name: "about",
|
||||
head() {
|
||||
return {
|
||||
title: 'About me - Arthur Danjou'
|
||||
}
|
||||
head() {},
|
||||
setup() {
|
||||
const { i18n } = useContext()
|
||||
|
||||
useMeta({
|
||||
title: `${i18n.t('header.about')} - Arthur Danjou`
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
<template>
|
||||
<main class="px-5 xl:px-64 mb-16 md:mb-32">
|
||||
<main v-if="project" class="px-5 xl:px-64 mb-16 md:mb-32">
|
||||
<div class="w-full flex flex-col lg:flex-row items-center md:items-start mt-8 md:mt-32">
|
||||
<div class="w-full lg:w-1/2 flex flex-col items-center">
|
||||
<div class="md:mb-24">
|
||||
<div class="mb-4 flex">
|
||||
<nuxt-link to="/work" class="back-arrow flex">
|
||||
<nuxt-link to="/projects" class="back-arrow flex">
|
||||
<div class="duration-300 arrow">
|
||||
<svg height="25" width="25" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18" />
|
||||
</svg>
|
||||
</div>
|
||||
<div class="ml-2">
|
||||
{{ $t('work.go_back') }}
|
||||
{{ $t('projects.go_back') }}
|
||||
</div>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
<img class="w-72 rounded-xl" :src="require(`@/assets/images/works/${work.cover}.png`)" alt="Project Img" />
|
||||
<img class="w-72 rounded-xl" :src="require(`@/assets/images/projects/${project.cover}`)" alt="Project Img" />
|
||||
<a
|
||||
class="mt-4 py-3 px-6 rounded-full cursor-pointer duration-300 mb-10 lg:mb-0"
|
||||
:class="getColor"
|
||||
:href="work.url"
|
||||
>{{work.url.replace('https://', '').replace('http://', '')}}</a>
|
||||
:href="project.url"
|
||||
>{{project.url.replace('https://', '').replace('http://', '')}}</a>
|
||||
</div>
|
||||
<div class="w-full lg:w-1/2 ml-5 ">
|
||||
<h1 class="text-xl lg:text-3xl font-bold">
|
||||
{{ work.title }}
|
||||
<h1 @click="debug" class="text-xl lg:text-3xl font-bold">
|
||||
{{ project.title }}
|
||||
</h1>
|
||||
<p class="mt-5 mb-10 text-md lg:text-lg text-gray-900 dark:text-dark-100">
|
||||
{{ $t(work.description) }}
|
||||
{{ $t(project.description) }}
|
||||
</p>
|
||||
<div>
|
||||
<h3 class="text-md lg:text-lg font-bold">
|
||||
{{ $t('work.tech_used') }}
|
||||
{{ $t('projects.tech_used') }}
|
||||
</h3>
|
||||
<div class="flex flex-row w-full overflow-x-auto md:overflow-x-hidden md:flex-wrap space-x-4 md:space-x-0 md:justify-start">
|
||||
<div v-if="skills && skills.length > 0" class="flex flex-row w-full overflow-x-auto md:overflow-x-hidden md:flex-wrap space-x-4 md:space-x-0 md:justify-start">
|
||||
<div v-for="skill in skills">
|
||||
<WorkSkill
|
||||
:skill="skill.title"
|
||||
@@ -49,42 +49,55 @@
|
||||
</main>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import WorkSkill from "~/components/WorkSkill";
|
||||
<script lang="ts">
|
||||
import {
|
||||
computed, onUpdated, useAsync, useContext,
|
||||
useMeta,
|
||||
useRoute,
|
||||
useStatic, watch, watchEffect,
|
||||
} from "@nuxtjs/composition-api";
|
||||
import {Project, Skill} from "../../../@types/types";
|
||||
import {IContentDocument} from "@nuxt/content/types/content";
|
||||
|
||||
export default {
|
||||
components: {WorkSkill},
|
||||
head() {
|
||||
return {
|
||||
title: 'Work - Arthur Danjou'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
work: null
|
||||
}
|
||||
},
|
||||
async asyncData({ params, $content, error }) {
|
||||
const work = await $content('works', params.slug)
|
||||
.fetch()
|
||||
.catch(() => {
|
||||
error({
|
||||
statusCode: 404,
|
||||
message: 'Work not found',
|
||||
head: {},
|
||||
setup() {
|
||||
const {$content, app, i18n} = useContext()
|
||||
const route = useRoute()
|
||||
const slug = computed(() => route.value.params.slug)
|
||||
|
||||
const project = useStatic((slug) => {
|
||||
return $content('projects', slug)
|
||||
.fetch<Project>()
|
||||
.catch(() => {
|
||||
app.error({statusCode: 404, message: "Project not found"})
|
||||
}) as Promise<Project>
|
||||
}, slug, 'projects')
|
||||
|
||||
const skills = useAsync(() => {
|
||||
return $content('skills')
|
||||
.where({
|
||||
slug: {
|
||||
$in: project.value?.skills
|
||||
}
|
||||
})
|
||||
});
|
||||
let skills = []
|
||||
if (work) {
|
||||
skills = await $content('skills').where({ slug: { $in: work.skills } }).fetch()
|
||||
.fetch<Skill>()
|
||||
.catch(() => {
|
||||
app.error({statusCode: 404, message: "Skills in project not found"});
|
||||
}) as Promise<Skill>
|
||||
})
|
||||
|
||||
useMeta({
|
||||
title: `${i18n.t('header.projects')} - Arthur Danjou - ${project.value?.title}`
|
||||
})
|
||||
|
||||
const debug = () => {
|
||||
console.log(project)
|
||||
console.log(skills)
|
||||
}
|
||||
return {
|
||||
work,
|
||||
skills
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getColor() {
|
||||
switch (this.work.color) {
|
||||
|
||||
const getColor = computed(() => {
|
||||
switch (project.value?.color) {
|
||||
case 'red':
|
||||
return 'bg-red-400 hover:bg-red-600'
|
||||
case 'orange':
|
||||
@@ -134,6 +147,13 @@ export default {
|
||||
case 'coolGray':
|
||||
return 'bg-coolGray-400 hover:bg-coolGray-600'
|
||||
}
|
||||
})
|
||||
|
||||
return {
|
||||
project,
|
||||
skills,
|
||||
getColor,
|
||||
debug
|
||||
}
|
||||
}
|
||||
}
|
||||
57
src/pages/projects/index.vue
Normal file
57
src/pages/projects/index.vue
Normal file
@@ -0,0 +1,57 @@
|
||||
<template>
|
||||
<main v-if="projects" class="work flex flex-col items-center">
|
||||
<PageTitle
|
||||
title="part.projects"
|
||||
>
|
||||
<svg class="inline-block icon" height="40" width="40" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 13.255A23.931 23.931 0 0112 15c-3.183 0-6.22-.62-9-1.745M16 6V4a2 2 0 00-2-2h-4a2 2 0 00-2 2v2m4 6h.01M5 20h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
|
||||
</svg>
|
||||
</PageTitle>
|
||||
<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-xl font-bold text-center mb-8">{{ $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" >
|
||||
<div class="md:mx-3 my-2" v-for="project in projects">
|
||||
<Project
|
||||
:title="project.title"
|
||||
:cover="project.cover"
|
||||
:description="project.description"
|
||||
:slug="project.slug"
|
||||
:tags="project.tags"
|
||||
:company="project.company"
|
||||
/>
|
||||
</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: {},
|
||||
setup() {
|
||||
const { $content, i18n } = useContext()
|
||||
|
||||
const projects = useAsync(() => {
|
||||
return $content('projects').fetch<Project>()
|
||||
})
|
||||
|
||||
useMeta({
|
||||
title: `${i18n.t('header.projects')} - Arthur Danjou`
|
||||
})
|
||||
|
||||
return {
|
||||
projects
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
</style>
|
||||
@@ -77,7 +77,12 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "uses"
|
||||
name: "uses",
|
||||
head() {
|
||||
return {
|
||||
title: `${this.$i18n.t('header.uses')} - Arthur Danjou`
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -1,51 +0,0 @@
|
||||
<template>
|
||||
<main class="work flex flex-col items-center px-5 xl:px-64">
|
||||
<PageTitle
|
||||
title="part.work"
|
||||
color="blue"
|
||||
>
|
||||
<svg class="inline-block icon" height="40" width="40" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 13.255A23.931 23.931 0 0112 15c-3.183 0-6.22-.62-9-1.745M16 6V4a2 2 0 00-2-2h-4a2 2 0 00-2 2v2m4 6h.01M5 20h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
|
||||
</svg>
|
||||
</PageTitle>
|
||||
<h1 v-if="works.length === 0" class="text-xl font-bold text-center my-8 w-full">{{ $t('work.no_work') }}</h1>
|
||||
<div v-else class="flex flex-col justify-around items-center py-10 w-full">
|
||||
<h1 class="text-xl font-bold text-center mb-8">{{ $t('work.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 v-for="work in works">
|
||||
<nuxt-link :to="'/work/' + work.slug">
|
||||
<Work
|
||||
:title="work.title"
|
||||
:url="work.url"
|
||||
:color="work.color"
|
||||
:cover="work.cover"
|
||||
/>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PageTitle from "~/components/PageTitle";
|
||||
import Work from "~/components/Work";
|
||||
export default {
|
||||
name: "index",
|
||||
components: {Work, PageTitle},
|
||||
head() {
|
||||
return {
|
||||
title: 'Work - Arthur Danjou'
|
||||
}
|
||||
},
|
||||
async asyncData({ $content }) {
|
||||
const works = await $content('works').fetch()
|
||||
return {
|
||||
works
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
</style>
|
||||
Reference in New Issue
Block a user