benjaminramey/benramey.com-gatsby.js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix several issues from copying and pasting into react

Browse Source
This commit is contained in:
Benjamin Ramey
2020-09-23 17:03:26 -05:00
parent d274352b5f
commit 0fb5d6ef41
5 changed files with 51 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/footer.js
View File

@@ -6,16 +6,18 @@ export default function Footer() {
const year = date.getYear() + 1900; const year = date.getYear() + 1900;
return ( return (
<footer class="footer"> <footer className="footer">
<div class="container"> <div className="container">
<small> <small>
&copy; <time datetime={timestamp}>{year}</time>. &copy; <time dateTime={timestamp}>{year}</time>.
All rights reserved. All rights reserved.
</small> </small>
</div> </div>
<div class="container"> <div className="container">
<hr /> <hr />
<div class="LI-profile-badge" data-version="v1" data-size="medium" data-locale="en_US" data-type="horizontal" data-theme="dark" data-vanity="benjaminstevenramey"><a class="LI-simple-link" href='https://www.linkedin.com/in/benjaminstevenramey?trk=profile-badge'>Benjamin Ramey</a></div> <div className="LI-profile-badge" data-version="v1" data-size="medium" data-locale="en_US" data-type="horizontal" data-theme="dark" data-vanity="benjaminstevenramey">
<a className="LI-simple-link" href='https://www.linkedin.com/in/benjaminstevenramey?trk=profile-badge'>Benjamin Ramey</a>
</div>
</div> </div>
</footer> </footer>
); );

10
src/components/header.js
View File

@@ -3,14 +3,14 @@ import React from "react";
export default function Header() { export default function Header() {
return ( return (
<header> <header>
<div class="container"> <div className="container">
<div class="d-flex justify-content-between align-item-center"> <div className="d-flex justify-content-between align-item-center">
<a href="/" class="d-flex justify-content-start align-items-center mr-2" title="Home"> <a href="/" className="d-flex justify-content-start align-items-center mr-2" title="Home">
<img src="https://en.gravatar.com/userimage/738990/32d8e61848233a67f5e02dcc43be0ff8.jpeg" <img src="https://en.gravatar.com/userimage/738990/32d8e61848233a67f5e02dcc43be0ff8.jpeg"
alt="Gravatar" /> alt="Gravatar" />
<span class="ml-2">Ben Ramey's Blog</span> <span className="ml-2">Ben Ramey's Blog</span>
</a> </a>
<div class="d-none d-sm-flex flex-column justify-content-around ml-2"> <div className="d-none d-sm-flex flex-column justify-content-around ml-2">
<small>Scripture, programming problems, solutions and stories.</small> <small>Scripture, programming problems, solutions and stories.</small>
</div> </div>
</div> </div>

4
src/components/nav.js
View File

@@ -2,8 +2,8 @@ import React from "react";
export default function Nav() { export default function Nav() {
return ( return (
<nav class="main"> <nav className="main">
<div class="container d-flex justify-content-center"> <div className="container d-flex justify-content-center">
{/* {% for page in site.pages %} {/* {% for page in site.pages %}
{% if page.title != null %} {% if page.title != null %}
{% if page.layout == "page" %} */} {% if page.layout == "page" %} */}

4
src/templates/page.js
View File

@@ -4,8 +4,8 @@ import Layout from "../components/layout"
export default function Page({ children }) { export default function Page({ children }) {
return ( return (
<Layout> <Layout>
<article class="page"> <article className="page">
<h1 class="page-title">page.title</h1> <h1 className="page-title">page.title</h1>
{children} {children}
</article> </article>
</Layout> </Layout>

24
src/templates/post.js
View File

@@ -7,23 +7,20 @@ export default function Post({ data }) {
const post = data.markdownRemark; const post = data.markdownRemark;
var tags = post.frontmatter.tags.map((tag) => { var tags = post.frontmatter.tags.map((tag) => {
return (<a href={'/tags/' + tag }>#{tag}</a>); return (<a key={tag} href={'/tags/' + tag }>#{tag}</a>);
}); });
var categories = post.frontmatter.categories.map((category) => { var categories = post.frontmatter.categories.map((category) => {
return (<a href={'/categories/' + category }>#{category}</a>); return (<a key={category} href={'/categories/' + category }>#{category}</a>);
}); });
var postDate = new Date(post.frontmatter.date);
console.log(postDate);
var isoDate = postDate.toISOString();
var visibleDate = postDate.toDateString();
return ( return (
<Layout> <Layout>
<div>
<article className="post"> <article className="post">
<h1 className="post-title">{post.frontmatter.title}</h1> <h1 className="post-title">{post.frontmatter.title}</h1>
<div className="post-info d-flex justify-content-start"> <div className="post-info d-flex justify-content-start">
<time datetime={isoDate} className="post-date">{visibleDate}</time> <time dateTime={post.frontmatter.isoDate} className="post-date">
{post.frontmatter.formattedDate}, {post.frontmatter.fromNowDate}
</time>
<nav className="post-tags"> <nav className="post-tags">
{tags} {tags}
</nav> </nav>
@@ -39,14 +36,12 @@ export default function Post({ data }) {
shortname='fishybusiness' shortname='fishybusiness'
config={ config={
{ {
url: "https://" + data.site.host + ":" + data.site.port, url: "https://" + data.site.host + data.sitePage.path,
identifier: post.slug, identifier: post.slug,
title: post.frontmatter.title, title: post.frontmatter.title,
language: 'en_US' language: 'en_US'
} }
}/> }/>
</div>
</Layout> </Layout>
) )
} }
@@ -58,7 +53,9 @@ export const query = graphql`
frontmatter { frontmatter {
title title
date formattedDate: date(formatString: "ddd MMM Do YYYY")
isoDate: date(formatString: "")
fromNowDate:date(fromNow:true)
categories categories
tags tags
} }
@@ -67,5 +64,8 @@ export const query = graphql`
host host
port port
} }
sitePage {
path
}
} }
` `