embed Source Code Pro as a web font

The blocks that comprise the logo are now reliably the same width as the
lettering in a *fixed-width font*, so no more weird skewed logos on
Chrome for Android.

data/changelog.md

@@ -1,3 +1,6 @@
+* **Enhancement:** Adopted Source Code Pro for the interface font. Most
+  importantly, the common font ensures that the blocks in the logo are always
+  the same width.
 * **Bug:** Fixed the page not scrolling predictably. Scrolling behaviour should
   also respect browsers configured to prefer reduced motion.
 * **Enhancement:** Added equipment, all of the essentials like `Dagger` and

web/www/package.json

@@ -16,7 +16,8 @@
   "dependencies": {
     "@tarekraafat/autocomplete.js": "^10.2.6",
     "initiative-web": "file:../pkg",
-    "marked": "^2.1.3"
+    "marked": "^2.1.3",
+    "source-code-pro": "^2.38.0"
   },
   "devDependencies": {
     "copy-webpack-plugin": "^9.0.1",

web/www/public/style.css

@@ -1,5 +1,5 @@
 * {
-    font-family: monospace;
+    font-family: "Source Code Pro";
     font-size: 100%;
     line-height: 1.2rem;
 }

web/www/webpack.config.js

@@ -39,6 +39,10 @@ module.exports = {
     }),
     new CopyWebpackPlugin({
       patterns: [
+        {
+          from: path.resolve(__dirname, "node_modules/source-code-pro"),
+          to: path.resolve(__dirname, "dist/source-code-pro"),
+        },
         {
           from: path.resolve(__dirname, "public/*.css"),
           to: path.resolve(__dirname, "dist/[name].[contenthash][ext]"),