From 0dcc99599e52d8e98f7895ec454d02e6a6e4cd85 Mon Sep 17 00:00:00 2001
From: Russell Ballestrini <russell.ballestrini@gmail.com>
Date: Tue, 2 Jun 2026 13:02:32 -0400
Subject: [PATCH] zebra-spaces: log full-width between .page and footer +
 resizable to 240px default

Per fox. Pulled the log section out of <aside class="controls"> and
moved it to a new <section id="sec-log"> sibling of .page, right
above the page-integrity footer. CSS:

- 240px default height (was 150px and stuck in a 360px column)
- resize: vertical so the user can drag it taller as needed
- min-height: 120px so it can't be collapsed to nothing
- full viewport width inside the body's padding box

Same dark-mode rules apply (#050505 bg / #333 border) since the
.log class selector didn't change.
---
 web/zebra-spaces.html | 31 ++++++++++++++++++++++++-------
 1 file changed, 24 insertions(+), 7 deletions(-)

diff --git a/web/zebra-spaces.html b/web/zebra-spaces.html
index fdea041..27ba101 100644
--- a/web/zebra-spaces.html
+++ b/web/zebra-spaces.html
@@ -475,7 +475,21 @@
     margin-top: 0.2rem;
   }
   .mod-actions:empty { display: none; }   /* no row gap when nothing to do */
-  .log { border: 1px solid #000; height: 150px; overflow-y: auto; padding: 0.5rem; font-size: 0.75rem; line-height: 1.5; background: #fafafa; }
+  /* log lives in its own full-width section beneath the .page grid.
+   * 240px default, vertical resize handle so the user can drag it
+   * taller when the chatter outpaces the viewport. */
+  #sec-log { margin-top: 1.25rem; }
+  .log {
+    border: 1px solid #000;
+    height: 240px;
+    min-height: 120px;
+    resize: vertical;
+    overflow-y: auto;
+    padding: 0.5rem;
+    font-size: 0.75rem; line-height: 1.5;
+    background: #fafafa;
+    width: 100%;
+  }
   .log-line { margin-bottom: 0.2rem; word-wrap: break-word; }
   .log-line .ts { color: #888; }
   .log-line.err { color: #b00; }
@@ -678,14 +692,17 @@ try {
   </div>
 </section>
 
-<section>
+</aside>
+</div>
+
+<!-- log moved out of the right column so it can use the full viewport
+     width. Sits between the .page grid and the page-integrity footer,
+     starts at 240px tall, vertical-resize handle for growing it. -->
+<section id="sec-log">
   <h2>log</h2>
   <div class="log" id="log"></div>
 </section>
 
-</aside>
-</div>
-
 <script>
 (async () => {
 const $ = (id) => document.getElementById(id);
@@ -3509,8 +3526,8 @@ logLine('', 'ready — pick a handle, type a rendezvous code, enter the space');
 
 <footer style="margin:2.2rem auto 0;font-size:0.65rem;color:#999;line-height:1.7;word-break:break-all;font-family:monospace">
   <span id="pi-seal" style="color:#777;cursor:default;user-select:none" title="">page integrity</span> &nbsp;·&nbsp; built <span class="stamp-date">2026-06-02</span><br>
-  md5 <span class="stamp-md5">8c1238b1dd72f2c72d3b3cae9cff676a</span><br>
-  sha256 <span class="stamp-sha">d900d6562ff205260f2a495858882abc1b66078ecb329d3e9b70be95100c329c</span><br>
+  md5 <span class="stamp-md5">6943dfacd39a9bdfd65afc8ff520a202</span><br>
+  sha256 <span class="stamp-sha">2586303203b2c3703e7f211d7350b160c7e9638c482531fa472f128248ad72b2</span><br>
   <span style="color:#bbb">hashes are of this page with these two fields zeroed — to verify, blank them and re-hash</span><br>
   <span style="color:#bbb">one self-contained file — <strong>save a copy</strong> and verify against these hashes; point at your own servers with ?signal= and ?turncred=, or <a href="host-your-own.html" style="color:#999">host your own community</a></span>
 </footer>