ivy.rs/src/components/ui/Strapline.astro
2025-04-29 22:09:12 +01:00

37 lines
958 B
Text

---
import Date from "../util/Date.astro";
import StyledLink from "../util/StyledLink.astro";
const { title, description, icon, date, back, backLabel } = Astro.props;
---
<div class="mb-4 mt-6">
{
() => {
if (back) {
return <StyledLink href={back} icon="fa-solid fa-arrow-left">{backLabel || "Back"}</StyledLink>
}
}
}
<h2 class="text-xl font-bold mt-1">
<i class={`${icon} text-xl mr-2 text-light-pu dark:text-dark-pu`}></i>
{title}
</h2>
<p
class="text-sm text-light-tx-2 dark:text-dark-tx-2 border-l-4 border-light-pu dark:border-dark-pu pl-5 mt-2 ml-2.5 border-double"
>
{description}
</p>
{
() => {
if (date) {
return (
<p class="mt-2 ml-1.5 text-sm text-light-tx-2 dark:text-dark-tx-2">
<i class="fa-solid fa-calendar-days mr-2 text-light-pu dark:text-dark-pu"></i>
<Date date={date} />
</p>
);
}
}
}
</div>