From df60dcacf36c0fb99b29c9dba6cebbcdf0f14d97 Mon Sep 17 00:00:00 2001
From: Matthias Kretschmann <m@kretschmann.io>
Date: Sun, 22 Apr 2018 18:56:31 +0200
Subject: [PATCH] fix project nav

---
 gatsby-node.js                  |  2 +-
 package.json                    |  3 ++-
 src/components/atoms/Head.js    | 22 +++++++++-------------
 src/components/atoms/Typekit.js | 26 --------------------------
 src/layouts/index.js            |  2 ++
 src/layouts/index.scss          |  1 -
 6 files changed, 14 insertions(+), 42 deletions(-)
 delete mode 100644 src/components/atoms/Typekit.js

diff --git a/gatsby-node.js b/gatsby-node.js
index 90278a1..492f430 100644
--- a/gatsby-node.js
+++ b/gatsby-node.js
@@ -44,7 +44,7 @@ exports.createPages = ({ boundActionCreators, graphql }) => {
             const slug = node.slug
 
             createPage({
-              path: `/${slug}/`,
+              path: slug,
               component: template,
               context: {
                 slug,
diff --git a/package.json b/package.json
index 8afacee..27b9a52 100644
--- a/package.json
+++ b/package.json
@@ -24,7 +24,8 @@
     "gatsby-transformer-json": "^1.0.16",
     "react-helmet": "^5.2.0",
     "react-markdown": "^3.3.0",
-    "react-transition-group": "^2.3.1"
+    "react-transition-group": "^2.3.1",
+    "react-typekit": "^1.1.3"
   },
   "devDependencies": {
     "babel-eslint": "^8.2.3",
diff --git a/src/components/atoms/Head.js b/src/components/atoms/Head.js
index 0a33572..f0da734 100644
--- a/src/components/atoms/Head.js
+++ b/src/components/atoms/Head.js
@@ -1,22 +1,18 @@
-import React, { Fragment } from 'react'
+import React from 'react'
 import PropTypes from 'prop-types'
 import Helmet from 'react-helmet'
-import Typekit from './Typekit'
 
 const Head = ({ meta }) => {
-  const { title, tagline, description, typekit } = meta
+  const { title, tagline, description } = meta
 
   return (
-    <Fragment>
-      <Helmet
-        defaultTitle={`${title.toLowerCase()} { ${tagline.toLowerCase()} }`}
-        titleTemplate={`%s // ${title.toLowerCase()} { ${tagline.toLowerCase()} }`}
-      >
-        <meta name="description" content={description} />
-        <meta content="noindex,nofollow" name="robots" />
-      </Helmet>
-      <Typekit id={typekit} />
-    </Fragment>
+    <Helmet
+      defaultTitle={`${title.toLowerCase()} { ${tagline.toLowerCase()} }`}
+      titleTemplate={`%s // ${title.toLowerCase()} { ${tagline.toLowerCase()} }`}
+    >
+      <meta name="description" content={description} />
+      <meta content="noindex,nofollow" name="robots" />
+    </Helmet>
   )
 }
 
diff --git a/src/components/atoms/Typekit.js b/src/components/atoms/Typekit.js
deleted file mode 100644
index 35e4917..0000000
--- a/src/components/atoms/Typekit.js
+++ /dev/null
@@ -1,26 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import Helmet from 'react-helmet'
-
-const TypekitScript = ({ id }) => (
-  <script>
-    {`
-        (function(d) {
-            var config = {
-                kitId: '${id}',
-                scriptTimeout: 3000,
-                async: true
-            },
-            h=d.documentElement,t=setTimeout(function(){h.className=h.className.replace(/\bwf-loading\b/g,"")+" wf-inactive";},config.scriptTimeout),tk=d.createElement("script"),f=false,s=d.getElementsByTagName("script")[0],a;h.className+=" wf-loading";tk.src='https://use.typekit.net/'+config.kitId+'.js';tk.async=true;tk.onload=tk.onreadystatechange=function(){a=this.readyState;if(f||a&&a!="complete"&&a!="loaded")return;f=true;clearTimeout(t);try{Typekit.load(config)}catch(e){}};s.parentNode.insertBefore(tk,s)
-        })(document);
-    `}
-  </script>
-)
-
-const Typekit = props => <Helmet>{TypekitScript(props)}</Helmet>
-
-export default Typekit
-
-TypekitScript.propTypes = {
-  id: PropTypes.string.isRequired,
-}
diff --git a/src/layouts/index.js b/src/layouts/index.js
index a5b238c..88488d4 100644
--- a/src/layouts/index.js
+++ b/src/layouts/index.js
@@ -1,5 +1,6 @@
 import React from 'react'
 import PropTypes from 'prop-types'
+import Typekit from 'react-typekit'
 import Head from '../components/atoms/Head'
 import Header from '../components/organisms/Header'
 import Footer from '../components/organisms/Footer'
@@ -12,6 +13,7 @@ const TemplateWrapper = ({ data, location, children }) => {
   return (
     <div className="app">
       <Head meta={meta} />
+      <Typekit kitId={meta.typekit} />
       <Header meta={meta} isHomepage={isHomepage} />
 
       {children()}
diff --git a/src/layouts/index.scss b/src/layouts/index.scss
index e3634c7..5d10ce1 100644
--- a/src/layouts/index.scss
+++ b/src/layouts/index.scss
@@ -25,7 +25,6 @@ body {
     line-height: $line-height;
     color: $font-color-base;
     text-rendering: optimizeLegibility;
-    font-display: swap;
     font-feature-settings: 'liga', 'kern';
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;