Add GoogleFonts component

CHANGELOG.md

@@ -12,7 +12,6 @@
 - Removed built-in syntax highlighting
 - Removed `notes` language attribute for fenced code blocks
 - Refactored dev server
-- Removes automatic Google Fonts linking
 
 ## v1.10.0 2019-02-18
 

docs/index.mdx

@@ -1,4 +1,4 @@
-export { future as theme } from '@mdx-deck/themes'
+export { big 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/GoogleFonts.js

@@ -0,0 +1,13 @@
+import React from 'react'
+import { createPortal } from 'react-dom'
+import { withTheme } from 'emotion-theming'
+
+const GoogleFonts = withTheme(({ theme }) => {
+  if (!theme.googleFont) return false
+  return createPortal(
+    <link rel="stylesheet" href={theme.googleFont} />,
+    document.head
+  )
+})
+
+export default GoogleFonts

packages/components/src/MDXDeck.js

@@ -8,6 +8,7 @@ import Slide from './Slide'
 import Presenter from './Presenter'
 import Overview from './Overview'
 import Print from './Print'
+import GoogleFonts from './GoogleFonts'
 import Catch from './Catch'
 import { default as defaultTheme } from '@mdx-deck/themes'
 
@@ -224,6 +225,7 @@ export class MDXDeck extends React.Component {
     return (
       <Provider {...this.props} {...this.state} mode={mode} index={index}>
         <Catch>
+          <GoogleFonts />
           <Wrapper {...this.state} index={index}>
             <Swipeable onSwipedRight={this.previous} onSwipedLeft={this.next}>
               <Router>