Enable width style work for content

README.md

@@ -1061,6 +1061,18 @@ try the following in `yoursite/layouts/partials/paige/style-first.css`:
 }
 ```
 
+### Narrow look
+
+By default, the content expands to fill the whole window.
+This can result in very long lines, depending on the window width.
+To use [the recommended line length of 66 characters](https://en.wikipedia.org/wiki/Line_length#Printed_text),
+try the following in `yoursite/hugo.toml`:
+
+```toml
+[params.paige]
+style = "#paige-content { width: 66ch; }"
+```
+
 ### Menu navigation only
 
 If you configure a menu, and intend for it to be sufficient for all navigation,

layouts/partials/paige/scripts.html

@@ -1,33 +1,5 @@
 {{ $page := . }}
 
-<script>
-function paigeResize() {
-    var e = document.querySelector("#paige-content");
-    if (!e) {
-        return;
-    }
-    var mw = getComputedStyle(e).maxWidth;
-    var w;
-    if (mw === "100%") {
-        var e = document.querySelector("#paige-root");
-        var s = getComputedStyle(e);
-        var px = parseFloat(s.paddingLeft) + parseFloat(s.paddingRight);
-        var bx = parseFloat(s.borderLeftWidth) + parseFloat(s.borderRightWidth);
-        w = e.offsetWidth - px - bx;
-    } else {
-        w = parseFloat(mw.substring(0, mw.length - 2));
-    }
-    var es = document.querySelectorAll(".paige-video");
-    for (var i = 0; i < es.length; i++) {
-        var e = es[i];
-        if (!e.style.height && !e.style.width) {
-            e.style.width = w + "px";
-        }
-    }
-}
-paigeResize();
-addEventListener("resize", paigeResize);
-</script>
 {{ partial "paige/script.html" (dict "page" $page "src" "js/paige/bootstrap/bootstrap.bundle.js") }}
 
 {{ if $page.Param "paige.math" }}

layouts/partials/paige/style.html

@@ -76,6 +76,7 @@ body, html {
 
 .paige-video {
     margin-bottom: 1rem;
+    min-width: 550px;
 }
 
 #paige-content {