44 lines
725 B
Plaintext
44 lines
725 B
Plaintext
---
|
|
import { add, format } from "date-fns";
|
|
|
|
import CalendarIcon from "@assets/svg/calendar.svg";
|
|
|
|
interface Props {
|
|
title: string;
|
|
date: Date;
|
|
slug?: string;
|
|
}
|
|
|
|
const { title, date, slug } = Astro.props;
|
|
---
|
|
|
|
<div class="blog-header">
|
|
{slug ? <a href={`/blog/${slug}`}>{title}</a> : <h1>{title}</h1>}
|
|
<div>
|
|
<CalendarIcon class="calendar-icon" width={24} height={24} />
|
|
<strong>{format(add(new Date(date), { hours: 6 }), "MMM do, y")}</strong>
|
|
</div>
|
|
</div>
|
|
|
|
<style lang="scss">
|
|
a {
|
|
font-size: 1.3rem;
|
|
}
|
|
|
|
strong {
|
|
font-weight: bolder;
|
|
}
|
|
|
|
.blog-header {
|
|
margin: 1rem 0;
|
|
}
|
|
|
|
.blog-header > h2 {
|
|
margin: 0;
|
|
}
|
|
|
|
.calendar-icon {
|
|
transform: translateY(0.3rem);
|
|
}
|
|
</style>
|