From 17f71103059957e6aac1fb66f81f959766f9144d Mon Sep 17 00:00:00 2001
From: Brent Jackson <jxnblk@gmail.com>
Date: Sat, 6 Jul 2019 23:52:03 +0100
Subject: [PATCH] Simplify example

---
 .../@jxnblk/gatsby-theme-mdx-blog/colors.js   | 21 -----
 .../@jxnblk/gatsby-theme-mdx-blog/header.js   |  5 +-
 example/src/pages/about.mdx                   | 12 ++-
 example/src/pages/beep.js                     | 22 -----
 example/src/pages/index.mdx                   | 12 ---
 example/src/pages/notes.mdx                   | 82 -------------------
 example/src/pages/unstyled.mdx                |  9 --
 theme/gatsby-node.js                          |  2 +-
 8 files changed, 7 insertions(+), 158 deletions(-)
 delete mode 100644 example/src/@jxnblk/gatsby-theme-mdx-blog/colors.js
 delete mode 100644 example/src/pages/beep.js
 delete mode 100644 example/src/pages/index.mdx
 delete mode 100644 example/src/pages/notes.mdx
 delete mode 100644 example/src/pages/unstyled.mdx

diff --git a/example/src/@jxnblk/gatsby-theme-mdx-blog/colors.js b/example/src/@jxnblk/gatsby-theme-mdx-blog/colors.js
deleted file mode 100644
index 5501a7b..0000000
--- a/example/src/@jxnblk/gatsby-theme-mdx-blog/colors.js
+++ /dev/null
@@ -1,21 +0,0 @@
-// imports seem to be broken
-// import { colors } from '@jxnblk/gatsby-theme-mdx-blog'
-// console.log(colors)
-
-import colors from '@jxnblk/gatsby-theme-mdx-blog/src/colors'
-import { get } from 'theme-ui'
-
-// Colors for the theme can be configured by shadowing this file
-export default {
-  ...colors,
-  modes: {
-    dark: get(colors, 'modes.dark'),
-    book: {
-      text: '#321',
-      background: '#fefdf6',
-      primary: '#a20',
-      secondary: '#810',
-      muted: '#f0f0e6',
-    }
-  }
-}
diff --git a/example/src/@jxnblk/gatsby-theme-mdx-blog/header.js b/example/src/@jxnblk/gatsby-theme-mdx-blog/header.js
index ba79e8f..695f7db 100644
--- a/example/src/@jxnblk/gatsby-theme-mdx-blog/header.js
+++ b/example/src/@jxnblk/gatsby-theme-mdx-blog/header.js
@@ -2,10 +2,7 @@
 import React from 'react'
 import { Link } from 'gatsby'
 import { jsx, Container, Styled, useColorMode } from 'theme-ui'
-import {
-  Box,
-  Button,
-} from '@jxnblk/gatsby-theme-mdx-blog'
+import { Button } from '@jxnblk/gatsby-theme-mdx-blog'
 
 const modes = [
   'light',
diff --git a/example/src/pages/about.mdx b/example/src/pages/about.mdx
index 6bca72c..633e826 100644
--- a/example/src/pages/about.mdx
+++ b/example/src/pages/about.mdx
@@ -1,10 +1,8 @@
-import { Link } from 'gatsby'
+import Readme from '@jxnblk/gatsby-theme-mdx-blog/README.md'
+import Layout from '../layout'
 
-# @jxnblk/gatsby-theme-mdx-blog
+export default Layout
 
-## Demo Site
+This is an example site built with `@jxnblk/gatsby-theme-mdx-blog`.
 
-This page is intentionally unstyled. Only pages within the
-<Link to='/blog'>Blog</Link> have styles.
-
-The <Link to='/beep'>Beep</Link> page is a custom page that uses styles from the theme.
+<Readme />
diff --git a/example/src/pages/beep.js b/example/src/pages/beep.js
deleted file mode 100644
index 4aeacf6..0000000
--- a/example/src/pages/beep.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import React from 'react'
-import { Link } from 'gatsby'
-import {
-  Styled,
-  Root
-} from '@jxnblk/gatsby-theme-mdx-blog'
-
-const Page = props => {
-  return (
-    <Root>
-      <Styled.h1>Beep</Styled.h1>
-      <Styled.a as={Link} to='/'>
-        Home
-      </Styled.a>
-      <Styled.p>
-        This page is outside of the theme, but imports styled components from the theme's package.
-      </Styled.p>
-    </Root>
-  )
-}
-
-export default props => <Page />
diff --git a/example/src/pages/index.mdx b/example/src/pages/index.mdx
deleted file mode 100644
index 0374005..0000000
--- a/example/src/pages/index.mdx
+++ /dev/null
@@ -1,12 +0,0 @@
-import Readme from '@jxnblk/gatsby-theme-mdx-blog/README.md'
-import { Styled } from '@jxnblk/gatsby-theme-mdx-blog'
-import { Link } from 'gatsby'
-import Layout from '../layout'
-
-export default Layout
-
-This is an example site built with `@jxnblk/gatsby-theme-mdx-blog`.
-
-View the **<Styled.a as={Link} to='/blog'>Blog</Styled.a>** to see it in action or view the <Styled.a as={Link} to='/unstyled'>Unstyled page</Styled.a> to see how styles are isolated from the global scope.
-
-<Readme />
diff --git a/example/src/pages/notes.mdx b/example/src/pages/notes.mdx
deleted file mode 100644
index 391efca..0000000
--- a/example/src/pages/notes.mdx
+++ /dev/null
@@ -1,82 +0,0 @@
-
-# Notes
-
-## Theme Shape
-
-- colors
-- ...system theme
-- layout/blocks
-  - root
-  - header
-  - main
-  - sidebar
-  - container
-  - footer
-- mdx/styles/components
-  - h1
-  - h2
-  - p
-  - img
-  - a
-  - etc...
-
-## Components
-
-```jsx
-<ThemeProvider>
-  <Layout>
-    <Header />
-    <Main>
-      <Content />
-    </Main>
-    <Footer />
-  </Layout>
-</ThemeProvider>
-```
-
-```jsx
-<ThemeProvider>
-  <Layout>
-    <Header />
-    <Main>
-      <Sidebar />
-      <Container>
-        <Content />
-      </Container>
-    </Main>
-    <Footer />
-  </Layout>
-</ThemeProvider>
-```
-
-Layout handles:
-
-- Base typography
-- colors
-- layout for flexbox/etc
-
-Alternative names:
-
-- Root
-
-```jsx
-<ThemeProvider>
-  <Root>
-    <Header />
-    <Main>
-      <Container>
-        <Content />
-      </Container>
-    </Main>
-    <Footer />
-  </Root>
-</ThemeProvider>
-```
-
-```jsx
-<Layout.Root>
-  <Layout.Header />
-  <Layout.Main />
-  <Layout.Footer />
-</Layout.Root>
-```
diff --git a/example/src/pages/unstyled.mdx b/example/src/pages/unstyled.mdx
deleted file mode 100644
index 59022f5..0000000
--- a/example/src/pages/unstyled.mdx
+++ /dev/null
@@ -1,9 +0,0 @@
-import { Link } from 'gatsby'
-
-# Demo Site
-
-This page is intentionally unstyled. Only pages within the <Link to='/blog'>Blog</Link> have styles.
-
-- <Link to='/blog'>Blog</Link>
-- Styled page: <Link to='/beep'>This page</Link> is a custom page that uses styles from the theme.
-- Docs: <Link to='/'>Theme Readme</Link>
diff --git a/theme/gatsby-node.js b/theme/gatsby-node.js
index 36a05b8..6fc41a5 100644
--- a/theme/gatsby-node.js
+++ b/theme/gatsby-node.js
@@ -34,7 +34,7 @@ exports.createPages = async ({
   actions,
 }, opts = {}) => {
   const {
-    name = 'blog',
+    name = '',
     pageSize = 12,
   } = opts