34 lines
1.1 KiB
Vue
34 lines
1.1 KiB
Vue
<script setup lang="ts">
|
|
import AppLayout from '@/layouts/AppLayout.vue';
|
|
import { achievements } from '@/routes';
|
|
import { Head } from '@inertiajs/vue3';
|
|
import PlaceholderPattern from '../components/PlaceholderPattern.vue';
|
|
</script>
|
|
|
|
<template>
|
|
|
|
<Head title="Erfolge" />
|
|
|
|
<AppLayout>
|
|
<div class="flex h-full flex-1 flex-col gap-4 overflow-x-auto rounded-xl p-4">
|
|
|
|
<div>
|
|
<h1 class="text-xl">Kategorie</h1>
|
|
<h2 class="text-sm text-neutral-400 mb-4">3 von 10 freigeschaltet</h2>
|
|
|
|
<div class="flex flex-row flex-wrap gap-4">
|
|
<div v-for="n in 10" class="relative flex flex-col items-center">
|
|
<div
|
|
class="w-48 relative aspect-square overflow-hidden rounded-full border border-sidebar-border/70 dark:border-sidebar-border">
|
|
<PlaceholderPattern />
|
|
</div>
|
|
<label class="">Erfolg {{ n
|
|
}}</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</AppLayout>
|
|
</template>
|