29 lines
1 KiB
JavaScript
29 lines
1 KiB
JavaScript
|
import Link from 'next/link'
|
||
|
|
import styles from './index.module.scss'
|
||
|
|
|
||
|
|
export default function LatestPosts({ posts }) {
|
||
|
|
return (
|
||
|
|
<div className={styles.container}>
|
||
|
|
<ul className={styles.postsList}>
|
||
|
|
{posts.map((post) => (
|
||
|
|
<li className={styles.post} key={post.slug}>
|
||
|
|
<div>
|
||
|
|
<Link href={`/posts/${encodeURIComponent(post.slug)}`}>
|
||
|
|
<a>
|
||
|
|
<h3 className={styles.postHeader}>{post.title}</h3>
|
||
|
|
</a>
|
||
|
|
</Link>
|
||
|
|
<time className={styles.postTimestamp}>{post.date.toString()}</time>
|
||
|
|
<div className={styles.postBlurb} dangerouslySetInnerHTML={{ __html: post.excerptHtml }}>{post.excerpt}</div>
|
||
|
|
<Link href={`/posts/${encodeURIComponent(post.slug)}`}>
|
||
|
|
<a className={styles.postReadMoreButtonLink}>
|
||
|
|
<span role="button" className={styles.postReadMoreButton}>Read More →</span>
|
||
|
|
</a>
|
||
|
|
</Link>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
))}
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|