Files
eventmaster/software/src/components/cardWithTopImage.vue

44 lines
848 B
Vue

<script setup lang="ts">
defineProps({
image: String,
title: String,
smallerTitle: {
type: Boolean,
default: false
}
})
</script>
<template>
<v-card
variant="tonal"
link
>
<v-img
:src="'http://localhost:3000/static/' + image"
aspect-ratio="1"
style="background-color: aliceblue;"
cover
/>
<div v-if="title">
<v-card-title v-if="!smallerTitle">
{{ title }}
</v-card-title>
<v-card-title v-else style="font-size: medium">
{{ title }}
</v-card-title>
</div>
<div class="px-4 pb-4" v-if="$slots.default">
<slot></slot>
</div>
<v-card-actions v-if="$slots.actions" class="card-actions position-absolute bottom-0 right-0">
<v-spacer />
<slot name="actions"></slot>
</v-card-actions>
</v-card>
</template>