2023-09-03 14:40:49 +02:00

45 lines
715 B
Vue

<template>
<div class="employee-box">
<img :src="$helper.getImage(image)" class="image">
<h3 class="name">{{ name }}</h3>
<h4 class="role">{{ role }}</h4>
</div>
</template>
<script>
export default {
props: {
image: String,
name: String,
role: String,
},
}
</script>
<style lang="scss" scoped>
.employee-box {
text-align: center;
}
.name {
margin: 36px 0 0;
font-weight: 700;
font-size: 24px;
line-height: 28px;
padding: 0;
}
.role {
margin: 28px 0 0;
font-weight: 500;
font-size: 16px;
line-height: 23.44px;
padding: 0;
}
@media only screen and (max-width: 767px) {
.role {
margin-top: 8px;
}
}
</style>