Front matter
This commit is contained in:
parent
e6d2c55c1f
commit
c17a5728a3
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
Loading…
Reference in New Issue