designtopack/src/components/project/cards/PhysicalSample.vue
2024-12-20 08:05:55 +01:00

27 lines
680 B
Vue

<template>
<div class="card | physical-sample">
<header
class="text-center rounded-lg py-32"
:style="'--cover: url(' + step.cover + ')'"
>
<h3 class="text-lg font-serif">
<router-link :to="'/' + step.uri" class="link-full">{{
step.title
}}</router-link>
</h3>
<time class="font-medium text-sm py-8" :datetime="step.date">{{
step.date
}}</time>
<p>{{ step.description }}</p>
</header>
<img
:src="step.files[0].url"
alt=""
loading="lazy"
class="rounded-lg mt-16"
/>
</div>
</template>
<script setup>
const { step } = defineProps({ step: Object });
</script>