36 lines
862 B
Vue
36 lines
862 B
Vue
<template>
|
|
<div class="bg-white p-6 rounded-xl shadow-lg border border-gray-100">
|
|
<div v-if="imageFilename" class="mb-4 flex justify-center">
|
|
<img
|
|
:src="`/api/personen/${imageFilename}?width=200&height=200`"
|
|
:alt="`${title}: ${name}`"
|
|
class="w-32 h-32 object-cover rounded-full border-4 border-primary-100 shadow-md"
|
|
loading="lazy"
|
|
/>
|
|
</div>
|
|
<h3 v-if="title" class="text-xl font-display font-bold text-gray-900 mb-2">{{ title }}</h3>
|
|
<h4 class="text-lg font-semibold text-primary-600 mb-3">{{ name }}</h4>
|
|
<div class="space-y-1 text-gray-600">
|
|
<slot />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
defineProps({
|
|
title: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
name: {
|
|
type: String,
|
|
required: true
|
|
},
|
|
imageFilename: {
|
|
type: String,
|
|
default: null
|
|
}
|
|
})
|
|
</script>
|
|
|