move typekit id to env var

.env.example

@@ -1 +1,2 @@
 GATSBY_GITHUB_TOKEN=xxx
+GATSBY_TYPEKIT_ID=xxx

content/meta.yml

@@ -13,8 +13,6 @@
   addressbook: /matthias-kretschmann.vcf
   bugs: https://github.com/kremalicious/portfolio/issues/new
 
-  typekitID: dtg3zui
-
   # Analytics tools
   matomoUrl: https://analytics.kremalicious.com
   matomoSite: 2

src/components/atoms/HostnameCheck.module.css

@@ -5,7 +5,7 @@
   padding: calc(var(--spacer) / 3);
   font-size: var(--font-size-small);
   font-weight: bold;
-  background: var(--brand-light);
+  background: var(--box-background-color);
 }
 
 .hostnameInfo p {

src/components/atoms/Typekit.jsx

@@ -1,13 +1,12 @@
 import React from 'react'
 import { Helmet } from 'react-helmet'
-import { useMeta } from '../../hooks/use-meta'
 
-const TypekitScript = (typekitID) => (
+const TypekitScript = () => (
   <script>
     {`
         (function(d) {
             var config = {
-                kitId: '${typekitID}',
+                kitId: '${process.env.GATSBY_TYPEKIT_ID}',
                 scriptTimeout: 3000,
                 async: true
             },
@@ -18,13 +17,10 @@ const TypekitScript = (typekitID) => (
 )
 
 export default function Typekit() {
-  const { typekitID } = useMeta()
-
   return (
     <Helmet>
       <link rel="preconnect" href="https://use.typekit.net" />
-
+      <TypekitScript />
-      {TypekitScript(typekitID)}
     </Helmet>
   )
 }

src/hooks/use-meta.js

@@ -18,7 +18,6 @@ const query = graphql`
       }
       gpg
       addressbook
-      typekitID
       matomoUrl
       matomoSite
       allowedHosts

tests/__fixtures__/meta.json

@@ -19,7 +19,6 @@
     "gpg": "https://kretschmann.io/pub.gpg",
     "addressbook": "/matthias-kretschmann.vcf",
     "bugs": "https://github.com/kremalicious/portfolio/issues",
-    "typekitID": "dtg3zui",
     "matomoUrl": "https://analytics.kremalicious.com",
     "matomoSite": 2,
     "allowedHosts": [