posts.

bradgarropy · Mar 25, 2020 · e96caee · e96caee
1 parent 0564a72
commit e96caee
Show file tree

Hide file tree

Showing 8 changed files with 17 additions and 16 deletions.
diff --git a/gatsby-node.js b/gatsby-node.js
@@ -4,7 +4,7 @@ const createPostPage = (post, createPage) => {
     const {slug} = post.frontmatter
 
     createPage({
-        path: `/blog/${slug}`,
+        path: `/posts/${slug}`,
         component: path.resolve("./src/templates/post.js"),
         context: {slug},
     })

diff --git a/src/components/Header/Navigation.js b/src/components/Header/Navigation.js
@@ -32,8 +32,8 @@ const Navigation = ({open = true}) => {
 
     return (
         <StyledNavigation open={open}>
-            <StyledLink to="/blog" onClick={onClick}>
-                blog
+            <StyledLink to="/posts" onClick={onClick}>
+                posts
             </StyledLink>
 
             <StyledLink to="/episodes" onClick={onClick}>

diff --git a/src/components/Posts/FeaturedPosts.js b/src/components/Posts/FeaturedPosts.js
@@ -42,12 +42,12 @@ const FeaturedPosts = ({posts}) => {
 
                 return (
                     <StyledPost key={index}>
-                        <Link to={`/blog/${slug}`}>
+                        <Link to={`/posts/${slug}`}>
                             <Image fluid={image} />
                         </Link>
 
                         <PostMeta>
-                            <PostTitle to={`/blog/${slug}`}>
+                            <PostTitle to={`/posts/${slug}`}>
                                 <h2>{title}</h2>
                             </PostTitle>
                         </PostMeta>

diff --git a/src/components/Posts/Post.js b/src/components/Posts/Post.js
@@ -26,7 +26,7 @@ const Post = ({post}) => {
 
     return (
         <StyledPost>
-            <Link to={`/blog/${slug}`}>
+            <Link to={`/posts/${slug}`}>
                 <Image fluid={image} />
             </Link>
 

diff --git a/src/components/Posts/PostMeta.js b/src/components/Posts/PostMeta.js
@@ -35,7 +35,7 @@ const PostMeta = ({post}) => {
         <StyledPostMeta>
             <span>{date}</span>
 
-            <PostTitle to={`/blog/${slug}`}>
+            <PostTitle to={`/posts/${slug}`}>
                 <Title>{title}</Title>
             </PostTitle>
 

diff --git a/src/pages/index.js b/src/pages/index.js
@@ -21,7 +21,7 @@ const MoreButton = styled(Link)`
         secondary ? theme.colors.red : theme.colors.white};
 `
 
-const BlogSection = styled.div`
+const PostsSection = styled.div`
     display: grid;
     gap: 2rem;
 `
@@ -49,13 +49,13 @@ const IndexPage = () => {
             <SEO />
 
             <Section color="white">
-                <BlogSection>
+                <PostsSection>
                     <SectionHeader>latest posts</SectionHeader>
                     <FeaturedPosts posts={posts} />
-                    <MoreButton secondary="true" to="/blog">
+                    <MoreButton secondary="true" to="/posts">
                         read more
                     </MoreButton>
-                </BlogSection>
+                </PostsSection>
             </Section>
 
             <Section color="red">

diff --git a/src/pages/blog.js → src/pages/posts.js b/src/pages/blog.js → src/pages/posts.js
@@ -5,21 +5,21 @@ import {SEO} from "../components/SEO"
 import Container from "../styles/Container"
 import Posts from "../components/Posts/Posts"
 
-const BlogPage = ({uri}) => {
+const PostsPage = ({uri}) => {
     const posts = usePosts()
 
     return (
         <Container>
-            <SEO path={uri} title="Blog" />
+            <SEO path={uri} title="Posts" />
 
-            <h1>blog</h1>
+            <h1>posts</h1>
             <Posts posts={posts} />
         </Container>
     )
 }
 
-BlogPage.propTypes = {
+PostsPage.propTypes = {
     uri: PropTypes.string.isRequired,
 }
 
-export default BlogPage
+export default PostsPage
diff --git a/src/styles/Container.js b/src/styles/Container.js
@@ -2,6 +2,7 @@ import styled from "styled-components"
 
 const Container = styled.div`
     display: grid;
+    justify-content: center;
     padding: 3rem 4rem;
 `