From 0816be3881a392896e983706d01526bcc70abcca Mon Sep 17 00:00:00 2001
From: "ivan.aksamentov" <ivan.aksamentov@gmail.com>
Date: Mon, 25 Nov 2019 13:02:38 +0100
Subject: [PATCH] feat: serve Lato font locally instead of using Google fonts
 API

---
 index.html        | 8 --------
 package-lock.json | 5 +++++
 package.json      | 1 +
 src/index.js      | 3 +++
 webpack.config.js | 3 ++-
 5 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/index.html b/index.html
index 6b1a4d1e2..4011724de 100644
--- a/index.html
+++ b/index.html
@@ -15,13 +15,5 @@
     <!-- asyncronously load the (entry) react bundle -->
     <script async src="/dist/auspice.bundle.js"></script>
 
-    <!-- by placing this in the body, we mimic async ability
-    This is important as sometimes unpkg takes 10s to return and, if in the header
-    this blocks the page load.
-    https://codepen.io/tigt/post/async-css-without-javascript
-    https://stackoverflow.com/questions/9271276/is-the-recommendation-to-include-css-before-javascript-invalid
-    -->
-    <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Lato:100,200,300,400,500,700">
-
   </body>
 </html>
diff --git a/package-lock.json b/package-lock.json
index 126d826f2..bedc30b4c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8122,6 +8122,11 @@
       "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
       "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
     },
+    "typeface-lato": {
+      "version": "0.0.75",
+      "resolved": "https://registry.npmjs.org/typeface-lato/-/typeface-lato-0.0.75.tgz",
+      "integrity": "sha512-iA5uJD4PSTyIE4BDiSOexQeXkDkiJuX4Hu3wh3saJ06EB2TvJayab1Lbbmqq2je/LQv7KCQZHZmC0k4hedd8sw=="
+    },
     "ua-parser-js": {
       "version": "0.7.20",
       "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.20.tgz",
diff --git a/package.json b/package.json
index ccdfb5831..ff102d774 100644
--- a/package.json
+++ b/package.json
@@ -102,6 +102,7 @@
     "run-sequence": "~0.3.6",
     "style-loader": "^0.13.2",
     "styled-components": "^4.0.3",
+    "typeface-lato": "^0.0.75",
     "webpack": "^4.30.0",
     "webpack-cli": "^3.1.2",
     "webpack-dev-middleware": "^3.1.3",
diff --git a/src/index.js b/src/index.js
index 71bf9f46b..1a6e2fcf2 100644
--- a/src/index.js
+++ b/src/index.js
@@ -20,6 +20,9 @@ import "./css/notifications.css";
 import "./css/boxed.css";
 import "./css/select.css";
 
+/* FONTS */
+import 'typeface-lato';
+
 const store = configureStore();
 
 /* set up non-redux state storage for the animation - use this conservitavely! */
diff --git a/webpack.config.js b/webpack.config.js
index 4ebac49c6..8c34bdf36 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -122,7 +122,8 @@ const generateConfig = ({extensionPath, devMode=false, customOutputPath, analyze
           include: [
             ...directoriesToTransform,
             path.join(__dirname, 'node_modules/font-awesome'),
-            path.join(__dirname, 'node_modules/leaflet')
+            path.join(__dirname, 'node_modules/leaflet'),
+            path.join(__dirname, 'node_modules/typeface-lato')
           ]
         }
       ]