2020-05-23 20:34:35 +02:00
|
|
|
import PostPreview from './post-preview'
|
2022-07-08 06:10:26 +02:00
|
|
|
import type Post from '../interfaces/post'
|
2020-05-23 20:34:35 +02:00
|
|
|
|
|
|
|
type Props = {
|
|
|
|
posts: Post[]
|
|
|
|
}
|
|
|
|
|
2020-06-05 12:15:55 +02:00
|
|
|
const MoreStories = ({ posts }: Props) => {
|
2020-05-23 20:34:35 +02:00
|
|
|
return (
|
|
|
|
<section>
|
2021-12-16 18:43:48 +01:00
|
|
|
<h2 className="mb-8 text-5xl md:text-7xl font-bold tracking-tighter leading-tight">
|
2020-05-23 20:34:35 +02:00
|
|
|
More Stories
|
|
|
|
</h2>
|
2021-01-01 19:45:55 +01:00
|
|
|
<div className="grid grid-cols-1 md:grid-cols-2 md:gap-x-16 lg:gap-x-32 gap-y-20 md:gap-y-32 mb-32">
|
2020-05-23 20:34:35 +02:00
|
|
|
{posts.map((post) => (
|
|
|
|
<PostPreview
|
|
|
|
key={post.slug}
|
|
|
|
title={post.title}
|
|
|
|
coverImage={post.coverImage}
|
|
|
|
date={post.date}
|
|
|
|
author={post.author}
|
|
|
|
slug={post.slug}
|
|
|
|
excerpt={post.excerpt}
|
|
|
|
/>
|
|
|
|
))}
|
|
|
|
</div>
|
|
|
|
</section>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
export default MoreStories
|