waylon/gatsby-starter-blog-forestry
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use typography-theme-wordpress-2016 as default theme

Browse source
This commit is contained in:
Kyle Mathews 2016-06-28 20:02:19 -07:00
parent 3efd74a20f
commit a865b54d5e
8 changed files with 17 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

1
components/ReadNext.js
View file

@ -39,6 +39,7 @@ class ReadNext extends React.Component {
</h6> </h6>
<h3 <h3
style={{ style={{
marginTop: 0,
marginBottom: rhythm(1/4), marginBottom: rhythm(1/4),
}} }}
> >

20
css/styles.css
View file

@ -1,20 +0,0 @@
body {
color: rgb(66,66,66);
}
h1,h2,h3,h4,h5,h6 {
color: rgb(44,44,44);
}
a {
color: rgb(42,93,173);
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
blockquote {
padding-left: 16.875px;
border-left: 6px solid lightgray;
margin-left: 10.875px;
margin-right: 0;
padding-right: 0;
}

3
html.js
View file

@ -1,7 +1,7 @@
import React from 'react' import React from 'react'
import DocumentTitle from 'react-document-title' import DocumentTitle from 'react-document-title'
import { prefixLink } from 'gatsby-helpers' import { prefixLink } from 'gatsby-helpers'
import { TypographyStyle } from 'typography-react' import { GoogleFont, TypographyStyle } from 'typography-react'
import typography from './utils/typography' import typography from './utils/typography'
const BUILD_TIME = new Date().getTime() const BUILD_TIME = new Date().getTime()
@ -31,6 +31,7 @@ module.exports = React.createClass({
/> />
<title>{title}</title> <title>{title}</title>
<TypographyStyle typography={typography} /> <TypographyStyle typography={typography} />
<GoogleFont typography={typography} />
{css} {css}
</head> </head>
<body className="landing-page"> <body className="landing-page">

1
package.json
View file

@ -23,6 +23,7 @@
"safe-access": "^0.1.0", "safe-access": "^0.1.0",
"typography": "^0.10.2", "typography": "^0.10.2",
"typography-react": "^0.10.3", "typography-react": "^0.10.3",
"typography-theme-wordpress-2016": "^0.10.0",
"underscore.string": "^3.2.3" "underscore.string": "^3.2.3"
}, },
"devDependencies": { "devDependencies": {

12
pages/_template.js
View file

@ -5,8 +5,6 @@ import { prefixLink } from 'gatsby-helpers'
import { rhythm, fontSizeToMS } from 'utils/typography' import { rhythm, fontSizeToMS } from 'utils/typography'
import { config } from 'config' import { config } from 'config'
import '../css/styles.css'
class Template extends React.Component { class Template extends React.Component {
render () { render () {
const { location, children } = this.props const { location, children } = this.props
@ -18,10 +16,12 @@ class Template extends React.Component {
fontSize: fontSizeToMS(1.5).fontSize, fontSize: fontSizeToMS(1.5).fontSize,
lineHeight: fontSizeToMS(1.5).lineHeight, lineHeight: fontSizeToMS(1.5).lineHeight,
marginBottom: rhythm(1.5), marginBottom: rhythm(1.5),
marginTop: 0,
}} }}
> >
<Link <Link
style={{ style={{
boxShadow: 'none',
textDecoration: 'none', textDecoration: 'none',
color: 'inherit', color: 'inherit',
}} }}
@ -33,9 +33,15 @@ class Template extends React.Component {
) )
} else { } else {
header = ( header = (
<h3> <h3
style={{
fontFamily: 'Montserrat, sans-serif',
marginTop: 0,
}}
>
<Link <Link
style={{ style={{
boxShadow: 'none',
textDecoration: 'none', textDecoration: 'none',
color: 'inherit', color: 'inherit',
}} }}

2
pages/index.js
View file

@ -26,7 +26,7 @@ class BlogIndex extends React.Component {
marginBottom: rhythm(1/4), marginBottom: rhythm(1/4),
}} }}
> >
<Link to={prefixLink(page.path)}>{title}</Link> <Link style={{boxShadow: 'none'}} to={prefixLink(page.path)}>{title}</Link>
</li> </li>
) )
} }

8
utils/typography.js
View file

@ -1,11 +1,7 @@
import Typography from 'typography' import Typography from 'typography'
import Wordpress2016 from 'typography-theme-wordpress-2016'
const options = { const typography = new Typography(Wordpress2016)
baseFontSize: '18px',
baseLineHeight: '27px',
}
const typography = new Typography(options)
// Hot reload typography in development. // Hot reload typography in development.
if (process.env.NODE_ENV !== 'production') { if (process.env.NODE_ENV !== 'production') {

2
wrappers/md.js
View file

@ -16,7 +16,7 @@ class MarkdownWrapper extends React.Component {
return ( return (
<DocumentTitle title={`${post.title} | ${config.blogTitle}`}> <DocumentTitle title={`${post.title} | ${config.blogTitle}`}>
<div className="markdown"> <div className="markdown">
<h1>{post.title}</h1> <h1 style={{marginTop: 0}}>{post.title}</h1>
<div dangerouslySetInnerHTML={{ __html: post.body }} /> <div dangerouslySetInnerHTML={{ __html: post.body }} />
<em <em
style={{ style={{