maverick/netlify-cms-react-starter
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add react-markdown && tweak styles/layout

Browse source
This commit is contained in:
Jinksi 2017-03-29 14:00:50 +10:00
parent 3b2fff7cc2
commit c4c1d60ba1
7 changed files with 87 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
package.json
View file

@ -12,6 +12,7 @@
"react": "^15.4.2",
"react-dom": "^15.4.2",
"react-helmet": "^5",
"react-markdown": "^2.4.6",
"react-router-dom": "^4.0.0",
"react-snapshot": "^1.0.4",
"styled-components": "^1.4.4",

2
src/components/PageHeader.js
View file

@ -18,7 +18,7 @@ const PageHeader = (props) => (
<Header>
<Container>
<h1>{props.title}</h1>
{props.subTitle ? <h2>{props.subTitle}</h2> : ''}
{props.subtitle ? <h2>{props.subtitle}</h2> : ''}
</Container>
</Header>
)

12
src/globalStyles.js
View file

@ -4,7 +4,7 @@ import WebFont from 'webfontloader'
export const loadFonts = () => WebFont.load({
google: {
families: ['Cabin']
families: ['Cabin:400,500,600']
}
})
@ -20,7 +20,8 @@ export const color = {
export default () => injectGlobal`
${normalize()}
html{
html {
box-sizing: border-box;
font-size: 62.5%;
background: ${color.lightGrey};
@ -45,8 +46,11 @@ export default () => injectGlobal`
box-sizing: border-box;
}
a{
a {
color: ${color.primary};
}
strong{
font-weight: 600;
}
`

8
src/views/About.js
View file

@ -4,17 +4,17 @@ import Page from '../components/Page'
import PageHeader from '../components/PageHeader'
import { Container, Section } from '../components/common'
export default (props) => (
export default ({title}) => (
<Page>
<PageHeader title={props.title} subTitle='Welcome' />
<PageHeader title={title} subtitle='<About />' />
<Section thin>
<Container>
<h1>About</h1>
<h1>Hello World!</h1>
<p>A sem vel nec sodales mi vivamus senectus sed potenti a parturient nascetur tincidunt nisi pulvinar rhoncus a. Risus imperdiet taciti suspendisse facilisi a per metus cubilia varius a nostra adipiscing amet ultrices quisque ac mi a. Dictumst a ultrices mi a dignissim ad fermentum eget a nam et a blandit scelerisque. Taciti lorem tempor quam vestibulum dis habitasse vestibulum diam vel est ut proin dis auctor. Suscipit scelerisque orci magna interdum vel bibendum duis netus a consectetur dui magnis ac aliquet sem posuere tincidunt vestibulum.</p>
</Container>
</Section>
<Helmet>
<title>About</title>
<title>{title}</title>
</Helmet>
</Page>
)

22
src/views/Home.js
View file

@ -3,20 +3,30 @@ import Helmet from 'react-helmet'
import Page from '../components/Page'
import { Container, Section } from '../components/common'
import PageHeader from '../components/PageHeader'
import Marked from 'react-markdown'
export default (props) => {
console.log(props)
const content = `
# 🍉 HyperStatic
A not-so-static site boilerplate:
- **Create React App** for simplicity
- **Styled Components** for component-based css
- **React Router** for routing (v4)
- **React Helmet** for document titles, descriptions, meta
- **React Snapshot** for pre-rendering to static html so it works without Javascript ⭐️
`
export default ({title}) => {
return (
<Page>
<PageHeader title={props.title} />
<PageHeader title={title} subtitle='<Home />' />
<Section thin>
<Container>
<h1>Welcome.</h1>
<p>Hello!</p>
<Marked source={content} />
</Container>
</Section>
<Helmet>
<title>Home</title>
<title>{title}</title>
</Helmet>
</Page>
)

7
src/views/NoMatch.js
View file

@ -1,10 +1,15 @@
import React from 'react'
import Helmet from 'react-helmet'
import Page from '../components/Page'
import { Section, Container } from '../components/common'
export default () => (
<Page>
<h1>404?!</h1>
<Section thin>
<Container>
<h1>404 – Page Not Found ⛈</h1>
</Container>
</Section>
<Helmet>
<title>404 – Page Not Found</title>
</Helmet>

52
yarn.lock
View file

@ -1220,6 +1220,24 @@ commondir@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b"
commonmark-react-renderer@^4.2.4:
version "4.3.2"
resolved "https://registry.yarnpkg.com/commonmark-react-renderer/-/commonmark-react-renderer-4.3.2.tgz#f30cdebd66141eef45ccd2d82fc00861e1e1f747"
dependencies:
in-publish "^2.0.0"
lodash.assign "^4.2.0"
lodash.isplainobject "^4.0.6"
pascalcase "^0.1.1"
xss-filters "^1.2.6"
commonmark@^0.24.0:
version "0.24.0"
resolved "https://registry.yarnpkg.com/commonmark/-/commonmark-0.24.0.tgz#b80de0182c546355643aa15db12bfb282368278f"
dependencies:
entities "~ 1.1.1"
mdurl "~ 1.0.1"
string.prototype.repeat "^0.2.0"
compressible@~2.0.8:
version "2.0.9"
resolved "https://registry.yarnpkg.com/compressible/-/compressible-2.0.9.tgz#6daab4e2b599c2770dd9e21e7a891b1c5a755425"
@ -1722,7 +1740,7 @@ enhanced-resolve@~0.9.0:
memory-fs "^0.2.0"
tapable "^0.1.8"
entities@~1.1.1:
"entities@~ 1.1.1", entities@~1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/entities/-/entities-1.1.1.tgz#6e5c2d0a5621b5dadaecef80b90edfb5cd7772f0"
@ -2670,6 +2688,10 @@ imurmurhash@^0.1.4:
version "0.1.4"
resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea"
in-publish@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/in-publish/-/in-publish-2.0.0.tgz#e20ff5e3a2afc2690320b6dc552682a9c7fadf51"
indexes-of@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/indexes-of/-/indexes-of-1.0.1.tgz#f30f716c8e2bd346c7b67d3df3915566a7c05607"
@ -3452,6 +3474,10 @@ lodash.isarray@^3.0.0:
version "3.0.4"
resolved "https://registry.yarnpkg.com/lodash.isarray/-/lodash.isarray-3.0.4.tgz#79e4eb88c36a8122af86f844aa9bcd851b5fbb55"
lodash.isplainobject@^4.0.6:
version "4.0.6"
resolved "https://registry.yarnpkg.com/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz#7c526a52d89b45c45cc690b88163be0497f550cb"
lodash.keys@^3.0.0, lodash.keys@^3.1.2:
version "3.1.2"
resolved "https://registry.yarnpkg.com/lodash.keys/-/lodash.keys-3.1.2.tgz#4dbc0472b156be50a0b286855d1bd0b0c656098a"
@ -3527,6 +3553,10 @@ math-expression-evaluator@^1.2.14:
dependencies:
lodash.indexof "^4.0.5"
"mdurl@~ 1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/mdurl/-/mdurl-1.0.1.tgz#fe85b2ec75a59037f2adfec100fd6c601761152e"
media-typer@0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/media-typer/-/media-typer-0.3.0.tgz#8710d7af0aa626f8fffa1ce00168545263255748"
@ -3939,6 +3969,10 @@ parseurl@~1.3.1:
version "1.3.1"
resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.1.tgz#c8ab8c9223ba34888aa64a297b28853bec18da56"
pascalcase@^0.1.1:
version "0.1.1"
resolved "https://registry.yarnpkg.com/pascalcase/-/pascalcase-0.1.1.tgz#b363e55e8006ca6fe21784d2db22bd15d7917f14"
path-browserify@0.0.0:
version "0.0.0"
resolved "https://registry.yarnpkg.com/path-browserify/-/path-browserify-0.0.0.tgz#a0b870729aae214005b7d5032ec2cbbb0fb4451a"
@ -4490,6 +4524,14 @@ react-helmet@^5:
object-assign "^4.1.1"
react-side-effect "^1.1.0"
react-markdown@^2.4.6:
version "2.4.6"
resolved "https://registry.yarnpkg.com/react-markdown/-/react-markdown-2.4.6.tgz#ea8e6e725a1eef20361a61539f9d848b8205cc29"
dependencies:
commonmark "^0.24.0"
commonmark-react-renderer "^4.2.4"
in-publish "^2.0.0"
react-router-dom@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-4.0.0.tgz#4fa4418e14b8cfc5bcc0bdea0c4083fb8c2aef10"
@ -5144,6 +5186,10 @@ string.prototype.codepointat@^0.2.0:
version "0.2.0"
resolved "https://registry.yarnpkg.com/string.prototype.codepointat/-/string.prototype.codepointat-0.2.0.tgz#6b26e9bd3afcaa7be3b4269b526de1b82000ac78"
string.prototype.repeat@^0.2.0:
version "0.2.0"
resolved "https://registry.yarnpkg.com/string.prototype.repeat/-/string.prototype.repeat-0.2.0.tgz#aba36de08dcee6a5a337d49b2ea1da1b28fc0ecf"
string_decoder@^0.10.25, string_decoder@~0.10.x:
version "0.10.31"
resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-0.10.31.tgz#62e203bc41766c6c28c9fc84301dab1c5310fa94"
@ -5685,6 +5731,10 @@ xml-char-classes@^1.0.0:
version "2.0.1"
resolved "https://registry.yarnpkg.com/xml-name-validator/-/xml-name-validator-2.0.1.tgz#4d8b8f1eccd3419aa362061becef515e1e559635"
xss-filters@^1.2.6:
version "1.2.7"
resolved "https://registry.yarnpkg.com/xss-filters/-/xss-filters-1.2.7.tgz#59fa1de201f36f2f3470dcac5f58ccc2830b0a9a"
"xtend@>=4.0.0 <4.1.0-0", xtend@^4.0.0, xtend@^4.0.1:
version "4.0.1"
resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.1.tgz#a5c6d532be656e23db820efb943a1f04998d63af"