Make post list items into links

This commit is contained in:
LordMathis 2020-10-03 18:59:03 +02:00
parent 0aede99fd8
commit 790f606a49
3 changed files with 19 additions and 8 deletions

View File

@ -7,8 +7,10 @@ const PostLink = ({ post }) => {
const postDate = new Date(post.frontmatter.date)
const options = { year: 'numeric', month: 'long', day: 'numeric' };
const postDateString = postDate.toLocaleDateString('en', options);
const postUrl = "/posts/" + post.fileAbsolutePath.split('/').pop().split(".")[0]
return (
<Link to={postUrl}>
<div className={styles.postListItem} role="listitem">
<div className={styles.postHeader} >
<a href={post.frontmatter.link} className={styles.postTitle}>{post.frontmatter.title}</a>
@ -18,6 +20,8 @@ const PostLink = ({ post }) => {
<p>{post.excerpt}</p>
</div>
</div>
</Link>
)
}

View File

@ -17,6 +17,7 @@ const IndexPage = () => {
edges {
node {
id
fileAbsolutePath
excerpt
frontmatter {
date

View File

@ -2,6 +2,7 @@
.postDate {
float: right;
color: $white;
}
.postTitle {
@ -25,6 +26,11 @@
padding: 20px;
background-color: $black;
margin-bottom: 20px;
p {
text-decoration: none;
color: $white;
}
}
.postExcerpt {