1  ---
 2  import WorkExperienceCard from "~/components/card/WorkExperienceCard.svelte";
 3  import type { WorkExperience } from "~/models/work-experience.ts";
 4  
 5  interface Props {
 6  	workExperiences: WorkExperience[];
 7  }
 8  
 9  const { workExperiences } = Astro.props;
10  ---
11  
12  <section class="pt-8 md:pt-12">
13  	<h2
14  		id="experience-heading"
15  		class="work-experience-card text-2xl md:text-3xl font-bold font-display text-pink-950 tracking-wide pb-4"
16  	>
17  		Work Experience
18  	</h2>
19  	<div class="relative flex flex-col gap-2">
20  		{
21  			workExperiences.map((experience, index) => (
22  				<WorkExperienceCard {...experience} defaultOpen={index === 0} client:visible />
23  			))
24  		}
25  	</div>
26  </section>