Add end showcase
This commit is contained in:
@@ -0,0 +1,28 @@
|
||||
<script setup lang="ts">
|
||||
const props = defineProps<{
|
||||
count: number | string;
|
||||
title: string;
|
||||
icon: string;
|
||||
}>();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="card">
|
||||
<h3>{{ Number(count).toLocaleString('de') }}</h3>
|
||||
<VaIcon :name="icon" size="10rem" />
|
||||
<p>{{ title }}</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.card {
|
||||
@apply m-4 grid grid-cols-2 items-center justify-items-center gap-8 rounded-lg p-4 text-3xl shadow-lg;
|
||||
}
|
||||
|
||||
.card > *:nth-child(1) {
|
||||
@apply col-span-2 mt-auto text-9xl font-bold;
|
||||
}
|
||||
.card > *:nth-child(3) {
|
||||
@apply mr-auto text-left text-6xl;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user