27 lines
1014 B
Vue
27 lines
1014 B
Vue
<template>
|
|
<div class="mb-12 grid grid-cols-icon-card gap-x-4 grid-areas-icon-card">
|
|
<it-icon-calendar class="w-[60px] grid-in-icon" />
|
|
<h2 class="text-large font-bold grid-in-title">Datum</h2>
|
|
<p class="grid-in-value">{{ attendanceDay.date }}</p>
|
|
</div>
|
|
<div class="mb-12 grid grid-cols-icon-card gap-x-4 grid-areas-icon-card">
|
|
<it-icon-location class="w-[60px] grid-in-icon" />
|
|
<h2 class="text-large font-bold grid-in-title">Standort</h2>
|
|
<p class="grid-in-value">{{ attendanceDay.location }}</p>
|
|
</div>
|
|
<div class="grid grid-cols-icon-card content-between gap-x-4 grid-areas-icon-card">
|
|
<it-icon-trainer class="w-[60px] grid-in-icon" />
|
|
<h2 class="text-large font-bold grid-in-title">Trainer</h2>
|
|
<p class="grid-in-value">{{ attendanceDay.trainer }}</p>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type { CourseSessionAttendanceDay } from "@/types";
|
|
|
|
export interface Props {
|
|
attendanceDay: CourseSessionAttendanceDay;
|
|
}
|
|
defineProps<Props>();
|
|
</script>
|