Files
artsite/app/pages/uses.vue

112 lines
3.0 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<script setup lang="ts">
const { t } = useI18n({
useScope: 'local',
})
useSeoMeta({
title: 'Things I use',
description: t('description'),
})
const { data: items } = await useAsyncData('uses', async () => await queryCollection('uses').all())
const { data: categories } = await useAsyncData('categories', async () => await queryCollection('categories').all())
const photos = [
{
src: '/uses/jetbrains.webp',
caption: 'caption.jetbrains',
},
{
src: '/uses/pycharm.webp',
caption: 'caption.pycharm',
},
]
</script>
<template>
<main>
<AppTitle
:description="t('description')"
:title="t('title')"
/>
<div v-if="items" class="mt-12 space-y-12">
<UsesList v-for="category in categories" :title="category.name" :key="category.id">
<UsesItem
v-for="(item, id) in items.filter(item => item.category === String(category.meta.title).toLowerCase())"
:key="id"
:item="item"
/>
</UsesList>
<div class="relative">
<UCarousel
v-slot="{ item }"
arrows
loop
class="rounded-lg"
:autoplay="{ delay: 4000 }"
:items="photos"
prev-icon="i-lucide-chevron-left"
next-icon="i-lucide-chevron-right"
>
<ProseImg
rounded
:src="item.src"
:label="t(item.caption)"
:caption="t(item.caption)"
/>
</UCarousel>
</div>
</div>
</main>
</template>
<i18n lang="json">
{
"en": {
"title": "My uses",
"description": "Software I use, gadgets I love, and other things I recommend. Heres a big list of all of my favorite stuff.",
"hardware": "Hardware",
"software": "Software",
"ide": "IDE & Font",
"homelab": "My personal HomeLab",
"stack": "Stack",
"caption": {
"jetbrains": "My IntelliJ IDE",
"cursor": "My Cursor IDE",
"pycharm": "My PyCharm IDE",
"datagrip": "My DataGrip IDE"
}
},
"fr": {
"title": "Mes usages",
"description": "Logiciels que j'utilise, gadgets que j'adore et autres choses que je recommande. Voici une grande liste de toutes mes choses préférées.",
"hardware": "Matériel",
"software": "Logiciel",
"ide": "IDE & Police",
"homelab": "Mon HomeLab personnel",
"stack": "Stack",
"caption": {
"jetbrains": "Mon IDE IntelliJ Idea Ultimate",
"cursor": "Mon IDE Cursor",
"pycharm": "Mon IDE PyCharm",
"datagrip": "Mon IDE DataGrip"
}
},
"es": {
"title": "Mis aplicaciones.",
"description": "Los programas que utilizo, los gadgets que adoro y otras cosas que recomiendo. Aquí te hago una lista de todas mis cosas preferidas. ",
"hardware": "Material",
"software": "Programas",
"ide": "IDE y Fuente",
"homelab": "Mi HomeLab personal",
"stack": "Stack",
"caption": {
"jetbrains": "Mi IDE IntelliJ Idea Ultimate",
"cursor": "Mi IDE Cursor",
"pycharm": "Mi IDE PyCharm",
"datagrip": "Mi IDE DataGrip"
}
}
}
</i18n>