44 lines
1.3 KiB
Text
44 lines
1.3 KiB
Text
---
|
|
import type { CollectionEntry } from 'astro:content';
|
|
import EntryThumbnail from './EntryThumbnail.astro';
|
|
import TagList from './TagList.astro';
|
|
import { articlePath, formatDate, formatDateShort } from '../lib/site';
|
|
|
|
interface Props {
|
|
posts: CollectionEntry<'posts'>[];
|
|
showYear?: boolean;
|
|
currentTag?: string;
|
|
}
|
|
|
|
const { posts, showYear = true, currentTag } = Astro.props;
|
|
---
|
|
|
|
<ol class="article-list">
|
|
{
|
|
posts.map((post) => {
|
|
const href = articlePath(post);
|
|
return (
|
|
<li>
|
|
<time datetime={post.data.date.toISOString()}>
|
|
{showYear ? formatDate(post.data.date) : formatDateShort(post.data.date)}
|
|
</time>
|
|
<article>
|
|
<a class="entry-title" href={href}>
|
|
{post.data.title}
|
|
</a>
|
|
<p>{post.data.description}</p>
|
|
<TagList tags={post.data.tags} currentTag={currentTag} limit={3} />
|
|
</article>
|
|
<EntryThumbnail
|
|
src={post.data.thumbnail.src}
|
|
alt={post.data.thumbnail.alt}
|
|
href={href}
|
|
class="article-thumbnail"
|
|
widths={[120, 180, 240, 320, 480]}
|
|
sizes="(max-width: 700px) clamp(64px, 22vw, 80px), (max-width: 960px) 7rem, 8rem"
|
|
/>
|
|
</li>
|
|
);
|
|
})
|
|
}
|
|
</ol>
|