aboutsummaryrefslogtreecommitdiff
path: root/src/components/PostElement.astro
blob: e5a9c50225c21819d2319ebcd2ff8a3ebcf2eea6 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
---
import { type CollectionEntry } from "astro:content";
import dayjs from "dayjs";

type Props = {
	readonly post: CollectionEntry<"blog">;
};

const { post } = Astro.props;
const { remarkPluginFrontmatter } = await post.render();
const formattedDate = dayjs(post.data.pubDate.toString()).format("MMMM DD, YYYY");
---

<style lang="scss">
	@use "../scss/variables" as *;

	a {
		color: $colorText;
	}

	small {
		font-size: $fontSizeBase * 0.75;
		opacity: 0.5;
	}
</style>

<li>
	<a href={`/blog/${post.slug}`}>{post.data.title}</a>
	<div>
		<small>
			<time datetime={post.data.pubDate.toISOString()}>{formattedDate}</time>
			<span>•</span>
			<span>{remarkPluginFrontmatter.minutesRead}</span>
		</small>
	</div>
</li>