docs: migrate website to Gatsby v2 (#1623)
* website: initial conversion to gatsby v2 * fix unexpected history use warning * use commonjs only to fix gatsby error * fix gatsby import error with sidecar * remove unused postcss-colour-functions * remove unused prop * lowercase layout filename import to match actual file * chore(lint): format code
This commit is contained in:
@ -1,5 +1,8 @@
|
||||
import React from 'react';
|
||||
import Helmet from 'react-helmet';
|
||||
import { graphql } from 'gatsby';
|
||||
|
||||
import Layout from '../components/layout';
|
||||
|
||||
const BlogPost = ({ data }) => {
|
||||
const { html, frontmatter } = data.markdownRemark;
|
||||
@ -8,23 +11,25 @@ const BlogPost = ({ data }) => {
|
||||
const desc = meta_description || description;
|
||||
|
||||
return (
|
||||
<div className="docs page">
|
||||
<Helmet>
|
||||
<title>{title}</title>
|
||||
{desc && <meta name="description" content={desc} />}
|
||||
</Helmet>
|
||||
<div className="container">
|
||||
<article className="blog-content" id="blog-content">
|
||||
<div className="blog-post-header">
|
||||
<h1>{title}</h1>
|
||||
<p className="meta-info">
|
||||
by {author} on {date}
|
||||
</p>
|
||||
</div>
|
||||
<div dangerouslySetInnerHTML={{ __html: html }} />
|
||||
</article>
|
||||
<Layout>
|
||||
<div className="docs page">
|
||||
<Helmet>
|
||||
<title>{title}</title>
|
||||
{desc && <meta name="description" content={desc} />}
|
||||
</Helmet>
|
||||
<div className="container">
|
||||
<article className="blog-content" id="blog-content">
|
||||
<div className="blog-post-header">
|
||||
<h1>{title}</h1>
|
||||
<p className="meta-info">
|
||||
by {author} on {date}
|
||||
</p>
|
||||
</div>
|
||||
<div dangerouslySetInnerHTML={{ __html: html }} />
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
};
|
||||
|
||||
|
@ -1,7 +1,8 @@
|
||||
import React from 'react';
|
||||
import Helmet from 'react-helmet';
|
||||
import { matchPath } from 'react-router-dom';
|
||||
import { graphql } from 'gatsby';
|
||||
|
||||
import Layout from '../components/layout';
|
||||
import EditLink from '../components/edit-link';
|
||||
import Widgets from '../components/widgets';
|
||||
import DocsNav from '../components/docs-nav';
|
||||
@ -20,24 +21,26 @@ const DocPage = ({ data, location, history }) => {
|
||||
const { nav, page, widgets, menu } = data;
|
||||
|
||||
const docsNav = toMenu(menu.siteMetadata.menu.docs, nav);
|
||||
const showWidgets = matchPath(location.pathname, { path: '/docs/widgets' });
|
||||
const showWidgets = location.pathname.indexOf('/docs/widgets') !== -1;
|
||||
|
||||
return (
|
||||
<div className="docs detail page">
|
||||
<Helmet title={page.frontmatter.title} />
|
||||
<div className="container">
|
||||
<aside id="sidebar" className="sidebar">
|
||||
<DocsNav items={docsNav} location={location} />
|
||||
<MobileNav items={docsNav} history={history} />
|
||||
</aside>
|
||||
<article className="docs-content" id="docs-content">
|
||||
<EditLink path={page.fields.path} />
|
||||
<h1>{page.frontmatter.title}</h1>
|
||||
<div dangerouslySetInnerHTML={{ __html: page.html }} />
|
||||
{showWidgets && <Widgets widgets={widgets} />}
|
||||
</article>
|
||||
<Layout>
|
||||
<div className="docs detail page">
|
||||
<Helmet title={page.frontmatter.title} />
|
||||
<div className="container">
|
||||
<aside id="sidebar" className="sidebar">
|
||||
<DocsNav items={docsNav} location={location} />
|
||||
<MobileNav items={docsNav} history={history} />
|
||||
</aside>
|
||||
<article className="docs-content" id="docs-content">
|
||||
<EditLink path={page.fields.path} />
|
||||
<h1>{page.frontmatter.title}</h1>
|
||||
<div dangerouslySetInnerHTML={{ __html: page.html }} />
|
||||
{showWidgets && <Widgets widgets={widgets} />}
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
};
|
||||
|
||||
|
Reference in New Issue
Block a user