chiark / gitweb /
fix footer styling
authorIan Jackson <ijackson@chiark.greenend.org.uk>
Thu, 26 Nov 2020 19:34:46 +0000 (19:34 +0000)
committerIan Jackson <ijackson@chiark.greenend.org.uk>
Thu, 26 Nov 2020 19:34:46 +0000 (19:34 +0000)
Signed-off-by: Ian Jackson <ijackson@chiark.greenend.org.uk>
templates/landscape.tera
templates/loading.tera
templates/macros.tera
templates/session.tera

index 79b418b701201c3402b4dabb602c381fb6862f7b..f943d350691d17737b4e6d28906044ad61c683fe 100644 (file)
@@ -29,7 +29,7 @@
   }
 </style>
 {{ m::errors() }}
-<div style="display: flex; flex-flow: row none;">
+<div class="upper" style="display: flex; flex-flow: row none;">
   <div>{{ m::space() }}</div>
   <div id="rhs-panel">
       <div>
index ddd1ea0f20f5e602cc86b909860b9c3a8906c93d..1dcb73615320747885847241e0966bbb7078b231 100644 (file)
@@ -2,7 +2,9 @@
      SPDX-License-Identifier: AGPL-3.0-or-later
      There is NO WARRANTY. -->
 <html>
-<head>
+  <head>
+    <title>xxx game name - xxx nick - Otter
+    </title>
 <link rel="license" href="/_/libre">
 <script defer>let wasm_input = fetch('/_/wasm.wasm');</script>
 <script src="/_/wasm.js" defer></script>
index c1b986914708b936d3785d0e7549ffd4c65eedc7..aaa49259d78039122581ec4c580b41d05f3991ba 100644 (file)
@@ -8,9 +8,15 @@
       data-sse-url-prefix="{{sse_url_prefix}}"
       data-load="{{ load | escape }}">
 <style>
-  div[class=uos] {
+  html {
     background-color: #eef;
   }
+  .footer {
+    background-color: #ddf;
+  }
+  div[class=uos] {
+    background-color: white;
+  }
 </style>
 {% endmacro header %}
 
@@ -62,10 +68,21 @@ Hi {{nick | escape}}
 {% endmacro uos %}
 
 {% macro footer() %}
-<hr>
-<address>
-This server is running Otter, the Online TableTop Environment
-Renderer.  Otter and its shape (piece picture) libraries
-are <a href="/_/libre">Free Software</a> and come with NO
-WARRANTY.
+  <div class="footer">
+    <div class="footer"; style="
+         height: 100vw;
+         width: 200vw;
+         left: -50vw;
+         overflow-y: visible;
+         position: absolute;
+         z-index: -1;
+     "><!-- this fills in the rest of the page, including the margins -->
+    </div>
+    <hr>
+    <address style="max-height: 100vh;">
+      This server is running Otter, the Online TableTop Environment
+      Renderer.  Otter and its shape (piece picture) libraries
+      are <a href="/_/libre">Free Software</a> and come with NO
+      WARRANTY.
+  </div>
 {% endmacro footer %}
index 84e568e735182efdf07791b2f3392932b6624b11..4159567aae332d1d18663b68288304a213337be4 100644 (file)
@@ -1,6 +1,9 @@
 {% import "macros" as m %}{# -*- HTML -*- -#}
 {{ m::header() }}
 <style>
+  body {
+    min-height: 100vw;
+  }
   div[class=uos] { display: flex; flex-wrap: wrap; }
   div[class|=uokey] {
     outline: 1px solid #000;
   div[class=uokey-r] {
     align-self: end;
   }
-  .uos {
+  div[id=uos] {
     height: 100px;
   }
   .uos-mid {
     flex-grow: 1;
   }
 </style>
+<div class="upper">
 {{ m::nick() }}
 |
 {{ m::wresting() }}
@@ -48,5 +52,5 @@
     </table>
   </div>
 </div>
-
+</div>
 {{ m::footer() }}