senaduka/old-v2-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add author and date to blog posts, stylistic changes, graphql changes

Browse Source
This commit is contained in:
Morris
2018-10-03 20:14:31 +02:00
parent bf9bf50de1
commit 4009a5ec48
6 changed files with 37 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/Card.js
View File

@@ -21,6 +21,12 @@ const Card = ({ ...props }) => (
<h3 className="text-black font-medium text-center text-xl">
{props.title}
</h3>
<div className="flex mx-auto justify-center text-black mt-1 opacity-70">
{props.authorName && <address className="author text-sm m-1 font-bold roman author-name">{props.authorName}</address> }
{props.date && <time pubdate="true" className="text-sm m-1" dateTime="2011-08-28" title="August 28th, 2011">{props.date}</time> }
</div>
{props.subtitle && (
<span className="text-sm font-medium text-black pt-1 opacity-70">
{props.subtitle}

4
src/components/PageIntro.js
View File

@@ -29,11 +29,11 @@ class PageIntro extends Component {
value: 47,
density: {
enable: true,
value_area: 5000
value_area: 4444
}
},
size: {
value: 1.47
value: 1.77
},
color: {
value: "#5763ab"

5
src/pages/index.js
View File

@@ -187,6 +187,7 @@ const IndexPage = ({ ...props }) => (
url={`blog/${node.slug}`}
title={node.title}
date={node.date}
authorName={node.author.name}
imgAlt={node.title}
excerpt={node.excerpt}
image={
@@ -218,6 +219,10 @@ export const query = graphql`
node {
id
title
author {
id
name
}
excerpt
status
slug

7
src/styles/general.css
View File

@@ -230,4 +230,11 @@ a {
.crisp-client .crisp-1rjpbb7 .crisp-1rf4xdh .crisp-ewasyx .crisp-zyxrmn .crisp-1bu0ive .crisp-1uswakw {
display: none !important;
}
@media (min-width: 310px) {
.author-name::before {
content: "by ";
font-weight: normal;
}
}

4
src/templates/blog.js
View File

@@ -39,6 +39,7 @@ class Blog extends Component {
<Card
title={node.title}
date={node.date}
authorName={node.author.name}
imgAlt={node.title}
excerpt={node.excerpt}
image={
@@ -76,6 +77,9 @@ export const query = graphql`
excerpt
status
slug
author {
name
}
date(formatString: "MMMM DD, YYYY")
featured_media {
localFile {

16
src/templates/post-default.js
View File

@@ -33,16 +33,23 @@ class PostDefault extends Component {
>
<html lang="en" />
</Helmet>
<main className="container mx-auto p-4 max-w-lg sm:p-10">
<div className="text-center">
<img
className="w-full rounded"
className="w-full container mx-auto mt-10 rounded"
src={
data.wordpressPost.featured_media
? data.wordpressPost.featured_media.source_url
: ''
}
/>
<h1 className="mt-4">{data.wordpressPost.title}</h1>
</div>
<main className="container mx-auto p-4 max-w-lg sm:px-10">
<h1 className="mt-4">{data.wordpressPost.title}</h1>
<div className="flex mx-auto text-black mt-1 opacity-70">
{data.wordpressPost.author.name && <address className="author text-sm m-1 font-bold roman author-name">{data.wordpressPost.author.name}</address> }
{data.wordpressPost.date && <time pubdate="true" className="text-sm m-1" dateTime="2011-08-28" title="August 28th, 2011">{data.wordpressPost.date}</time> }
</div>
<div
className="leading-normal blog-post font-serif"
dangerouslySetInnerHTML={{
@@ -61,6 +68,9 @@ export const query = graphql`
title
slug
content
author {
name
}
date(formatString: "MMMM DD, YYYY")
featured_media {
source_url