add monogram font

src/.gitignore

@@ -0,0 +1 @@
+/fonts/monogram*

src/js/objects.js

@@ -91,7 +91,7 @@ export class Sprite {
 }
 
 function drawDebug(context, x, y, w, h) {
-  context.font = '14px serif';
+  context.font = '16px Monogram';
   context.fillStyle = '#ffffff';
   context.fillText(`${x}x${y}`, x + 1, y - 2);
   context.fillStyle = '#000000';

src/js/scene.js

@@ -37,6 +37,7 @@ export class Scene {
     this.#layers = Array();
   }
 
+  // TODO: remove it
   setScreenSize(w, h) {
     this.#canvas.width = w;
     this.#canvas.height = h;

src/styles.css

@@ -1,3 +1,19 @@
+@font-face {
+	font-family: 'Monogram';
+	src: url('/fonts/monogramextended.woff2') format('woff2'),
+		url('/fonts/monogramextended.woff') format('woff'),
+		url('/fonts/monogramextended.ttf') format('truetype');
+	font-weight: 500;
+	font-style: normal;
+	font-display: swap;
+}
+
+body {
+	display: flex;
+	gap: 8px;
+	justify-content: center;
+}
+
 canvas {
 	image-rendering: crisp-edges;
 	image-rendering: pixelated;