devscard/src/pdf/sections/main-section.pdf.astro
2023-01-25 22:32:21 +01:00

28 lines
1,020 B
Text

---
import type { MainSection } from '@/types/sections/main-section.types';
import Photo from '@/components/photo.astro';
import Description from '@/pdf/components/description.astro';
import LabelledValue from '@/pdf/components/labelled-value.astro';
export interface Props extends MainSection {}
const { image, fullName, role, details, pdfDetails, description } = Astro.props;
---
<div class="flex flex-col gap-4">
<div class="flex gap-6">
<Photo src={image} alt={fullName} class="w-40 h-40 max-w-[160px] max-h-[160px] rounded-2xl" />
<div>
<div class="text-3xl font-extrabold text-gray-900">{fullName}</div>
<div class="text-lg font-medium text-gray-700">{role}</div>
<div class="grid grid-cols-[auto_auto] gap-x-4 gap-y-1 pt-4">
{
(pdfDetails ?? details).map((detail) => (
<LabelledValue {...detail} class={detail.fullRow ? 'col-span-2' : undefined} />
))
}
</div>
</div>
</div>
<Description content={description} />
</div>