public/index.html

   1 <!doctype html>
   2 <html>
   3
   4 <head>
   5     <title>Tick City</title>
   6     <meta charset="utf-8">
   7     <link rel="preconnect" href="https://fonts.googleapis.com">
   8     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   9     <link href="https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@300;400;700&display=swap"
  10         rel="stylesheet">
  11     <script src="https://unpkg.com/htmx.org@1.7.0"
  12         integrity="sha384-EzBXYPt0/T6gxNp0nuPtLkmRpmDBbjg6WmCUZRLXBBwYYmwAUxzlSGej0ARHX0Bo" crossorigin="anonymous"
  13         defer></script>
  14     <link rel="stylesheet" type="text/css" href="https://unpkg.com/augmented-ui@2/augmented-ui.min.css">
  15     <link rel="stylesheet" href="/scifi.css">
  16 </head>
  17
  18 <body id="home">
  19     <h1 data-augmented-ui="tl-clip bl-clip none">Antares</h1>
  20     <div class="row">
  21         <div class="col">
  22             <p>Welcome to <b>Antares</b>, a free-to-play browser based strategy game.</p>
  23             <p>We're very early in development, but are always looking for new players to sign up and test things out. Just note
  24                 that the likelihood of you running into a broken feature or a bug is quite high at this point. If you do
  25                 encouter a bug or issue, feel free to post in our forums and one of the devs will take a look.
  26             </p>
  27
  28             <h2 data-augmented-ui="tl-clip bl-clip none">Upcoming Features</h2>
  29     <h3 data-augmented-ui="tl-clip bl-clip none">Species</h3>
  30     <p>
  31         Work is being done to add different Species to the game to allow further customization and strategy options.
  32     </p>
  33     <h3 data-augmented-ui="tl-clip bl-clip none">More Buildings</h3>
  34     <p>We're pretty light on buildings at the moment but we have plans for a few more:</p>
  35     <ul>
  36         <li>Homes</li>
  37         <li>Banks</li>
  38         <li>Mills</li>
  39         <li>Quarries</li>
  40         <li>Spy Hideouts</li>
  41         <li>Mage Towers</li>
  42     </ul>
  43         </div>
  44         <div class="col">
  45             <div class="row">
  46                 <div class="col pane" data-augmented-ui="tl-clip tr-2-clip-x br-2-clip-y bl-clip-x border">
  47                     <h3 data-augmented-ui="tl-clip bl-clip none">Signup</h3>
  48                     <form hx-post="/accounts">
  49                         <div>
  50                             <label>Username:</label>
  51                             <input type="text" name="username">
  52                         </div>
  53                         <div>
  54                             <label>Password:</label>
  55                             <input type="password" name="password">
  56                         </div>
  57                         <button type="submit" class="success">Sign Up</button>
  58                     </form>
  59                 </div>
  60             </div>
  61             <div class="row">
  62                 <div class="col pane" style="margin-top: 2rem; " data-augmented-ui="tl-clip tr-2-clip-x br-2-clip-y bl-clip-x border">
  63                     <h3 data-augmented-ui="tl-clip bl-clip none">Login</h3>
  64                     <form hx-post="/login">
  65                         <div>
  66                             <label>Username:</label>
  67                             <input type="text" name="username">
  68                         </div>
  69                         <div>
  70                             <label>Password:</label>
  71                             <input type="password" name="password">
  72                         </div>
  73                         <button type="submit">Log In</button>
  74                     </form>
  75                 </div>
  76
  77             </div>
  78         </div>
  79     </div>
  80
  81     <div class="row">
  82     </div>
  83
  84
  85     <footer>
  86         A project by <a href="https://xangelo.ca">xangelo</a>
  87     </footer>
  88 </body>
  89 </html>