sites/resume/src/components/Work.astro

---
interface Props {
    jobTitle: string
    projectName: string
    dateFrom: string
    dateTo: string
    children: HTMLLIElement[]
    obsolete: boolean
    area: string
}


const { jobTitle, projectName, dateFrom, dateTo, obsolete, area } = Astro.props;
---

<div>
	<div class="grid-cols-3 grid-rows-1 w-full text-base grid">
	  <h1 class="text-left"><strong>{jobTitle}</strong></h1>
	  <div class="flex justify-center text-center items-center gap-2">
		  <h1 class="text-base">{projectName}</h1>
		  <p class="w-fit bg-green-300 border border-green-700 text-xs rounded-lg px-1 text-center justify-center">{area}</p>
		  {
			  obsolete ?
			  <div class="bg-red-300 border border-red-700 text-xs rounded-lg px-1">Obsolete</div>
			  : null
		  }
	  </div>
	  <h1 class="text-right">{dateFrom} - {dateTo}</h1>
	</div>
	<ul class="ml-8 mt-2 list-disc text-sm">
	  <slot />
	</ul>
  </div>