Add Consolas webfont

src/components/ui/bsod/dispatchBsod.js

@@ -3,6 +3,7 @@ import ReactDOM from 'react-dom';
 
 import { bsod } from './actions';
 import BSoD from 'components/ui/bsod/BSoD';
+import font from 'services/font';
 
 let injectedStore;
 let onBsod;
@@ -11,9 +12,11 @@ export default function dispatchBsod(store = injectedStore) {
     store.dispatch(bsod());
     onBsod && onBsod();
 
-    ReactDOM.render(
-        <BSoD store={store} />,
-        document.getElementById('app')
+    font.load(['Consolas']).then(() =>
+        ReactDOM.render(
+            <BSoD store={store} />,
+            document.getElementById('app')
+        )
     );
 }
 

src/components/ui/bsod/styles.scss

@@ -2,6 +2,16 @@
 
 $font-family-monospaced: 'Consolas', monospace;
 
+@font-face {
+    font-family: 'Consolas';
+    font-style: normal;
+    font-weight: 400;
+    src: local('Consolas'),
+        url('~fonts/consolas/consolas-regular.woff2') format('woff2'), /* Super Modern Browsers */
+        url('~fonts/consolas/consolas-regular.woff') format('woff'), /* Modern Browsers */
+        url('~fonts/consolas/consolas-regular.ttf') format('truetype'); /* Safari, Android, iOS */
+}
+
 .body {
     height: 100%;
     background-color: $dark_blue;

src/services/font.js

@@ -3,19 +3,29 @@ import webFont from 'webfontloader';
 export default {
     /**
      * @param {array} families
+     * @param {object} options
+     * @param {bool} [options.external=false] - whether the font should be loaded from external source (e.g. google)
      *
      * @return {Promise}
      */
-    load(families = []) {
+    load(families = [], options = {}) {
+        let config = {
+            custom: {families}
+        };
+
+        if (options.external) {
+            config = {
+                google: {families}
+            };
+        }
+
         return new Promise((resolve) =>
             webFont.load({
                 classes: false,
                 active: resolve,
                 inactive: resolve, // TODO: may be we should track such cases
                 timeout: 2000,
-                custom: {
-                    families
-                }
+                ...config
             })
         );
     }