Browse Source

Adding MomentJS in cards

master
Agastya 2 years ago
parent
commit
7da563c76e
5 changed files with 12 additions and 6 deletions
  1. +3
    -0
      .gitignore
  2. +1
    -0
      package.json
  3. +3
    -2
      src/pages/index.js
  4. +3
    -2
      src/templates/blogPost.js
  5. +2
    -2
      src/templates/singleTagIndex.js

+ 3
- 0
.gitignore View File

@ -1,3 +1,6 @@
# Yarn lock
yarn.lock
# Logs
logs
*.log


+ 1
- 0
package.json View File

@ -15,6 +15,7 @@
"gatsby-source-filesystem": "^2.1.11",
"gatsby-transformer-remark": "^2.6.19",
"gatsby-transformer-sharp": "^2.2.7",
"moment": "^2.24.0",
"prismjs": "^1.17.1",
"prop-types": "^15.7.2",
"react": "^16.9.0",


+ 3
- 2
src/pages/index.js View File

@ -3,6 +3,7 @@ import React from 'react';
import Layout from '../components/layout';
import SEO from '../components/seo';
import { graphql, Link } from 'gatsby';
import moment from 'moment';
require('prismjs/plugins/line-numbers/prism-line-numbers.css');
export const query = graphql`
@ -46,7 +47,7 @@ export default function IndexPage(props) {
<div className={'post-feed'}>
{edges.map((edge, index) => {
const { frontmatter } = edge.node;
const publishDate = new Date(frontmatter.date).toDateString();
const published = moment(frontmatter.date).fromNow();
const cover = frontmatter.cover;
return (
<article className={'post-card'} key={frontmatter.path}>
@ -68,7 +69,7 @@ export default function IndexPage(props) {
{frontmatter.tags && frontmatter.tags[0].length
? frontmatter.tags[0] + ``
: ``}{' '}
{publishDate}
{published}
</span>
<h2 className={'post-card-title'}>{frontmatter.title}</h2>
</header>


+ 3
- 2
src/templates/blogPost.js View File

@ -2,6 +2,7 @@ import React from 'react';
import { graphql, Link } from 'gatsby';
import Footer from '../components/footer';
import TinyHeader from '../components/tinyHeader';
import moment from 'moment';
class BlogPostTemplate extends React.Component {
componentDidMount() {
@ -136,7 +137,7 @@ class BlogPostTemplate extends React.Component {
{next.frontmatter.tags
? next.frontmatter.tags[0] + ' • '
: ''}
{new Date(next.frontmatter.date).toDateString()}
{moment(next.frontmatter.date).fromNow()}
</span>
<h2 className={'post-card-title'}>
{next.frontmatter.title}
@ -172,7 +173,7 @@ class BlogPostTemplate extends React.Component {
{prev.frontmatter.tags
? prev.frontmatter.tags[0] + ' • '
: ''}
{new Date(prev.frontmatter.date).toDateString()}
{moment(prev.frontmatter.date).fromNow()}
</span>
<h2 className={'post-card-title'}>
{prev.frontmatter.title}


+ 2
- 2
src/templates/singleTagIndex.js View File

@ -2,6 +2,7 @@ import React from 'react';
import { Link } from 'gatsby';
import ComplexHeader from '../components/complexHeader';
import Footer from '../components/footer';
import moment from 'moment';
const SingleTagTemplate = ({ pageContext }) => {
const { cover, posts, tag } = pageContext;
@ -43,8 +44,7 @@ const SingleTagTemplate = ({ pageContext }) => {
>
<header className={'post-card-header'}>
<span className={'post-card-tags'}>
{tag} {' '}
{new Date(post.frontmatter.date).toDateString()}
{tag} {moment(post.frontmatter.date).fromNow()}
</span>
<h2 className={'post-card-title'}>
{post.frontmatter.title}


Loading…
Cancel
Save