From ff26f0f6244d567b833ed9a90ec8331ab112cb36 Mon Sep 17 00:00:00 2001
From: Mike Fix <mrfix84@gmail.com>
Date: Thu, 18 Jul 2019 20:54:22 -0700
Subject: [PATCH] move @font-face into function component

---
 components/Editor.js | 24 +++++++++++++++---------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/components/Editor.js b/components/Editor.js
index 3895d82..f190629 100644
--- a/components/Editor.js
+++ b/components/Editor.js
@@ -400,15 +400,7 @@ class Editor extends React.Component {
             </Overlay>
           )}
         </Dropzone>
-        <style jsx global>
-          {`
-            @font-face {
-              font-family: ${config.fontUrl ? config.fontFamily : ''};
-              src: url(${config.fontUrl || ''}) format('woff');
-              font-display: swap;
-            }
-          `}
-        </style>
+        <FontFace {...config} />
         <style jsx>
           {`
             .editor {
@@ -429,6 +421,20 @@ class Editor extends React.Component {
   }
 }
 
+function FontFace(config) {
+  return (
+    <style jsx global>
+      {`
+        @font-face {
+          font-family: ${config.fontUrl ? config.fontFamily : ''};
+          src: url(${config.fontUrl || ''}) format('woff');
+          font-display: swap;
+        }
+      `}
+    </style>
+  )
+}
+
 function isImage(file) {
   return file.type.split('/')[0] === 'image'
 }