Test out themes

docs/index.mdx

@@ -1,4 +1,4 @@
-export { big as theme } from '@mdx-deck/themes'
+export { future as theme } from '@mdx-deck/themes'
 import { Head, Image, Notes, Appear } from '@mdx-deck/components'
 import { Invert, Split, SplitRight, FullScreenCode, Horizontal} from '@mdx-deck/layouts'
 import Counter from './Counter'

packages/components/src/MDXDeck.js

@@ -10,7 +10,6 @@ import Overview from './Overview'
 import Print from './Print'
 import GoogleFonts from './GoogleFonts'
 import Catch from './Catch'
-import { default as defaultTheme } from '@mdx-deck/themes'
 
 const NORMAL = 'normal'
 const PRESENTER = 'presenter'
@@ -249,13 +248,11 @@ export class MDXDeck extends React.Component {
 
 MDXDeck.propTypes = {
   slides: PropTypes.array.isRequired,
-  theme: PropTypes.object.isRequired,
   headTags: PropTypes.array.isRequired,
 }
 
 MDXDeck.defaultProps = {
   slides: [],
-  theme: defaultTheme,
   headTags: [],
 }
 

packages/components/src/Provider.js

@@ -5,6 +5,7 @@ import { ThemeProvider } from 'emotion-theming'
 import merge from 'lodash.merge'
 import { HeadProvider } from './Head'
 import { MDXProvider } from '@mdx-js/tag'
+import defaultTheme from '@mdx-deck/themes'
 import mdxComponents from './mdx-components'
 
 const DefaultProvider = props => <>{props.children}</>
@@ -18,7 +19,7 @@ const mergeThemes = themes =>
 
 export const Provider = props => {
   const { headTags, theme: baseTheme, themes = [] } = props
-  const theme = mergeThemes([baseTheme, ...themes])
+  const theme = mergeThemes([defaultTheme, baseTheme, ...themes])
   const {
     Provider: UserProvider = DefaultProvider,
     components: themeComponents = {},

packages/components/src/Root.js

@@ -22,6 +22,7 @@ const themedCode = props => ({
   '& code, & pre': {
     fontFamily: props.theme.monospace,
     color: props.theme.colors.code,
+    background: props.theme.colors.codeBackground,
   },
 })
 

packages/themes/src/index.js

@@ -4,6 +4,7 @@ export { default as future } from './future'
 export { default as condensed } from './condensed'
 export { default as yellow } from './yellow'
 export { default as swiss } from './swiss'
+export { default as poppins } from './poppins'
 
 // serif
 export { default as book } from './book'

packages/themes/src/poppins.js

@@ -0,0 +1,14 @@
+export default {
+  font: '"Poppins", sans-serif',
+  googleFont: 'https://fonts.googleapis.com/css?family=Poppins:400,900',
+  heading: {
+    fontWeight: 900,
+    letterSpacing: '-0.05em',
+  },
+  blockquote: {
+    fontSize: '1.75em',
+    textAlign: 'left',
+    fontWeight: 900,
+    letterSpacing: '-0.05em',
+  },
+}