Front matter

This commit is contained in:
LordMathis 2019-03-26 22:08:51 +01:00
parent e6d2c55c1f
commit c17a5728a3
2 changed files with 13 additions and 6 deletions

View File

@ -20,7 +20,10 @@ export default class Blog extends Component {
)
}
let posts = this.props.posts.map((post) =>
let posts = this.props.posts.sort((a, b) => {
return a.data - b.date
})
let postsHTML = posts.map((post) =>
<tr className={styles.postListItem} key={post.title}>
<td>
<span className={styles.postDate}>{post.published}</span>
@ -38,7 +41,7 @@ export default class Blog extends Component {
<div className={contentStyle.content}>
<table>
<tbody className={styles.postsWrapper}>
{posts}
{postsHTML}
</tbody>
</table>
</div>

View File

@ -5,6 +5,7 @@ import '../static/stylesheets/globals.scss'
import contentStyle from '../static/stylesheets/content.scss'
import styles from './Post.scss'
import MarkdownIt from 'markdown-it'
import fm from 'front-matter'
export default class Post extends Component {
static propTypes = {
@ -14,7 +15,10 @@ export default class Post extends Component {
render () {
const md = MarkdownIt()
const result = md.render(this.props.post)
const content = fm(this.props.post)
const title = content.attributes.title
const date = content.attributes.date
const body = md.render(content.body)
if (this.props.isLoading) {
return (
@ -28,12 +32,12 @@ export default class Post extends Component {
<div>
<Navbar />
<div className={contentStyle.contentWrapper}>
<Header header={this.props.post.title} />
<Header header={title} />
<div className={contentStyle.content}>
<div className={styles.postDate}>
<h3>{this.props.post.published}</h3>
<h3>{date}</h3>
</div>
<div className={styles.postContent} dangerouslySetInnerHTML={{ __html: result }}>
<div className={styles.postContent} dangerouslySetInnerHTML={{ __html: body }}>
</div>
</div>
</div>