73 lines
1.4 KiB
Plaintext
73 lines
1.4 KiB
Plaintext
---
|
|
import { getCollection } from 'astro:content';
|
|
|
|
import BaseLayout from '@/layouts/BaseLayout.astro';
|
|
import ArticleCard from '@/components/ArticleCard.astro';
|
|
import Header from '@/components/Header.astro';
|
|
import LatestArticle from '@/components/LatestArticle.astro';
|
|
|
|
const allPosts = await getCollection('blog');
|
|
const posts = allPosts.sort(
|
|
(a, b) => b.data.pubDate.getTime() - a.data.pubDate.getTime()
|
|
);
|
|
|
|
const [latest, ...articles] = posts;
|
|
---
|
|
|
|
<BaseLayout>
|
|
<Header />
|
|
|
|
{
|
|
latest && (
|
|
<LatestArticle
|
|
id={latest.id}
|
|
title={latest.data.title}
|
|
description={latest.data.description}
|
|
/>
|
|
)
|
|
}
|
|
|
|
{
|
|
articles.length > 0 && (
|
|
<section class="feed">
|
|
<h2>Más artículos</h2>
|
|
<ul>
|
|
{articles.map(({ id, data }) => (
|
|
<li>
|
|
<ArticleCard
|
|
id={id}
|
|
title={data.title}
|
|
description={data.description}
|
|
pubDate={data.pubDate}
|
|
/>
|
|
</li>
|
|
))}
|
|
<li class="feed-cap" />
|
|
</ul>
|
|
</section>
|
|
)
|
|
}
|
|
</BaseLayout>
|
|
|
|
<style>
|
|
.feed h2 {
|
|
font-size: 0.8125rem;
|
|
font-weight: 600;
|
|
letter-spacing: 0.075rem;
|
|
margin-bottom: 1.125rem;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.feed ul {
|
|
list-style: none;
|
|
}
|
|
|
|
.feed li {
|
|
border-top: 1px solid var(--border);
|
|
}
|
|
|
|
.feed-cap {
|
|
padding: 0;
|
|
}
|
|
</style>
|