X-Git-Url: https://git.cworth.org/git?p=lmno.games;a=blobdiff_plain;f=scribe%2Fscribe.css;h=6b1e5a642a54d2d582bfee477a5ac884371dcbdd;hp=fd634f0e06434a92ffb5d3c967f78969b865850a;hb=bc101387edcc19bf11d69d662b5ff46134795e3a;hpb=91ddcd6ad4ab4294f345421d1a490462b01b6496

diff --git a/scribe/scribe.css b/scribe/scribe.css
index fd634f0..6b1e5a6 100644
--- a/scribe/scribe.css
+++ b/scribe/scribe.css
@@ -1,6 +1,6 @@
 /* We want our board to be the largest square that can
  * fit. Unfortunately, it requires a bit of CSS magic to make that
- * happen. We can set a wdith easily enough, but what we can't easily
+ * happen. We can set a width easily enough, but what we can't easily
  * do is to set the height to be exactly the same as the width.
  *
  * So here's the magic to get that to happen. On the board container
@@ -12,8 +12,8 @@
  * any child sas "height: 100%" that will result in a 0-height child
  * and won't be what we want.
  *
- * So the last piece of the magic is to use absolute palcement of the
- * board (which require position:relative on its parent) and set all
+ * So the last piece of the magic is to use absolute placement of the
+ * board (which requires position:relative on its parent) and set all
  * of its edges (top, left, bottom, right) to the extents of the
  * container.
  *
@@ -57,7 +57,8 @@
     display: flex;
     justify-content: center;
     align-items: center;
-    font-size: 5vmin;
+    font-size: calc(min(8vw, .08 * var(--page-max-width)));
+    line-height: 0;
     font-weight: bold;
     border-bottom: 1px solid #999;
     border-right: 1px solid #999;