center code entry vertically

rest/templates/form-open.tpl

@@ -19,9 +19,20 @@ input[type=text] {
 }
 button[type=submit] {
     font-size: 1.5em;
+}
+form {
+    position: absolute;
+    top: 50vh;
+    height: 12em;
+    margin-top: -8em;
+    padding-bottom: 4em;
+    left: 50vw;
+    width: 15em;
+    margin-left: -7.5em;
+    display: inline-grid;
 }
     </style>
-    <title>Open {{tool}}</title>
+    <title>{{tool.title()}}</title>
     <meta name="viewport" content="width=device-width, initial-scale=1"/>
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@2.1.0/build/pure-min.css" integrity="sha384-yHIFVG6ClnONEA5yB5DJXfW2/KC173DIQrYoZMEtBvGzmf0PKiGyNEqe9N6BNDBH" crossorigin="anonymous"/>
     <link rel="stylesheet" href="https://shandan.one/css/grids-responsive-min.css"/>
@@ -31,9 +42,10 @@ button[type=submit] {
       % include('button-style')
       <form id="{{tool}}-open" action="{{action}}" method="{{method}}">
         <label for="{{tool}}-code">
-          <span>Enter<span hidden="true">&nbs;Code</span></span>
+          <span hidden="true">Enter&nbs;</span>
+          <span>{{tool.title()}}</span>
+          <span hidden="true">&nbs;Code</span></span>
         </label>
-        <br/>
         <input
           type="text"
           id="{{tool}}-code"
@@ -46,8 +58,7 @@ button[type=submit] {
           style="margin: 0.1em 0 0.3em"
           autofocus="true"
         ></input>
-        <br/>
         <button class="button-resize pure-button" type="submit" form="{{tool}}-open"> Open </button>
     </form>
   </body>
-</html>
+</html>