Ensure fonts are loaded from local instead of gfonts

Signed-off-by: Knut Ahlers <knut@ahlers.me>

Makefile

@@ -1,6 +1,7 @@
 default: pack
 
 compile_js:
+	rm -f ./frontend/assets/*
 	docker run --rm -i \
 		-v "$(CURDIR):$(CURDIR)" \
 		-w "$(CURDIR)/js" \

js/package.json

@@ -13,7 +13,11 @@
   },
   "dependencies": {
     "bootstrap": "^3.3.7",
+    "bootstrap-sass": "^3.3.7",
     "bootswatch": "^3.3.7",
-    "jquery": "^3.3.1"
+    "jquery": "^3.3.1",
+    "node-sass": "^4.11.0",
+    "sass-loader": "^7.1.0",
+    "typeface-roboto": "^0.0.54"
   }
 }

js/src/index.js

@@ -1,8 +1,7 @@
 import 'jquery'
 import 'bootstrap'
 
-import 'bootstrap/dist/css/bootstrap.min.css'
+import './style.scss'
-import 'bootswatch/paper/bootstrap.min.css'
 
 import storage from './storage.js'
 

js/src/style.css

@@ -1,7 +0,0 @@
-body { background-color: #e2e2e2; }
-.white { background-color: #fff; }
-.center { text-align: center; }
-.faq { margin-top: 3em; }
-.progress { margin-bottom: 0px; }
-.jumbotron p { margin-bottom: 0; }
-

js/src/style.scss

@@ -0,0 +1,31 @@
+$icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/";
+$web-font-path: '~typeface-roboto/index.css';
+@import '~bootswatch/paper/_variables.scss';
+
+@import "~bootstrap-sass/assets/stylesheets/bootstrap";
+@import '~bootswatch/paper/_bootswatch.scss';
+
+body {
+  background-color: #e2e2e2;
+}
+
+.white {
+  background-color: #fff;
+}
+
+.center {
+  text-align: center;
+}
+
+.faq {
+  margin-top: 3em;
+}
+
+.progress {
+  margin-bottom: 0px;
+}
+
+.jumbotron p {
+  margin-bottom: 0;
+}
+

js/webpack.config.js

@@ -22,8 +22,12 @@ module.exports = {
         }
       },
       {
-        test: /\.css$/,
+        test: /\.s?css$/,
-        use: ['style-loader', 'css-loader']
+        use: [
+          "style-loader", // creates style nodes from JS strings
+          "css-loader", // translates CSS into CommonJS
+          "sass-loader" // compiles Sass to CSS, using Node Sass by default
+        ]
       },
       {
         test: /\.(woff|woff2|eot|ttf|otf|svg)$/,