git.cworth.org Git - zombocom-ai/blob - tardis.html

   1 <!DOCTYPE html>
   2 <html>
   3
   4 <head>
   5   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   6   <title>ZOMBO</title>
   7   <link href="/zombo.css" rel="stylesheet" type="text/css">
   8   <meta name="viewport" content="width=device-width,initial-scale=1">
   9   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  10   <meta name="HandheldFriendly" content="true">
  11
  12   <style>
  13     @keyframes zoom {
  14         to {
  15             opacity: 0%;
  16             transform: scale(30);
  17         }
  18     }
  19     .zoom-now {
  20         animation-name: zoom;
  21         animation-duration: 2s;
  22         animation-timing-function: ease-in;
  23         animation-fill-mode: forwards;
  24     }
  25     #welcome {
  26         position: fixed;
  27         width: 100%;
  28         top: 50%;
  29         left: 50%;
  30         transform: translate(-50%, -50%);
  31     }
  32     #game {
  33         position: relative;
  34     }
  35     #word {
  36         text-align: center;
  37         font-size: 500%;
  38         font-weight: bold;
  39     }
  40     #interface {
  41         width: 100%;
  42     }
  43     #input {
  44         display: block;
  45         margin-left: auto;
  46         margin-right: auto;
  47         width: 60%;
  48         font-size: 200%;
  49         border-width: 5px;
  50     }
  51     #reboot {
  52         position: fixed;
  53         right: 5px;
  54         bottom: 5px;
  55     }
  56     #welcome-message {
  57         font-size: 120%;
  58         font-weight: bold;
  59         text-align: center;
  60     }
  61   </style>
  62 </head>
  63
  64 <body>
  65   <div id="content">
  66
  67     <div id="welcome">
  68       <div id="header" align="center">
  69         <p>
  70           <img src="/images/928785925_A_Van_Gogh_painting_of_the_Tardis.png">
  71         </p>
  72       </div>
  73
  74       <p id="welcome-message">
  75         Waiting to enter Tardis.
  76         <br>
  77         Companions present: <span id="companions">1</span>/4
  78       </p>
  79     </div>
  80
  81     <div id="game" style="display: none">
  82       <h1 id="step">Step 1: Calibrate the Trans-Dimensional Field Accelerator</h1>
  83
  84       <div id="word">
  85         What
  86       </div>
  87       <div id="interface">
  88         <input id="input">
  89         </input>
  90       </div>
  91       <button id="reboot">
  92         Reboot Tardis
  93       </button>
  94     </div>
  95
  96   </div>
  97 </body>
  98 </html>