public/index.html

   1 <!doctype html>
   2 <html>
   3
   4 <head>
   5     <title>Antares</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" id="notifications"></div>
  22     </div>
  23     <div class="row">
  24         <div class="col">
  25             <p>Welcome to <b>Antares</b>, a free-to-play browser based strategy game.</p>
  26             <p>We're very early in development, but are always looking for new players to sign up and test things out. Just note
  27                 that the likelihood of you running into a broken feature or a bug is quite high at this point. If you do
  28                 encouter a bug or issue, feel free to post in our forums and one of the devs will take a look.
  29             </p>
  30
  31             <h2 data-augmented-ui="tl-clip bl-clip none">Upcoming Features</h2>
  32     <h3 data-augmented-ui="tl-clip bl-clip none">Species</h3>
  33     <p>
  34         Work is being done to add different Species to the game to allow further customization and strategy options.
  35     </p>
  36     <h3 data-augmented-ui="tl-clip bl-clip none">More Buildings</h3>
  37     <p>We're pretty light on buildings at the moment but we have plans for a few more:</p>
  38     <ul>
  39         <li>Homes</li>
  40         <li>Banks</li>
  41         <li>Mills</li>
  42         <li>Quarries</li>
  43         <li>Spy Hideouts</li>
  44         <li>Mage Towers</li>
  45     </ul>
  46         </div>
  47         <div class="col">
  48             <div class="row">
  49                 <div class="col pane" data-augmented-ui="tl-clip tr-2-clip-x br-2-clip-y bl-clip-x border">
  50                     <h3 data-augmented-ui="tl-clip bl-clip none">Signup</h3>
  51                     <form hx-post="/accounts" hx-target="#notifications">
  52                         <div>
  53                             <label>Username:</label>
  54                             <input type="text" name="username">
  55                         </div>
  56                         <div>
  57                             <label>Password:</label>
  58                             <input type="password" name="password">
  59                         </div>
  60                         <button type="submit" class="success">Sign Up</button>
  61                     </form>
  62                 </div>
  63             </div>
  64             <div class="row">
  65                 <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">
  66                     <h3 data-augmented-ui="tl-clip bl-clip none">Login</h3>
  67                     <form hx-post="/login" hx-target="#notifications">
  68                         <div>
  69                             <label>Username:</label>
  70                             <input type="text" name="username">
  71                         </div>
  72                         <div>
  73                             <label>Password:</label>
  74                             <input type="password" name="password">
  75                         </div>
  76                         <button type="submit">Log In</button>
  77                     </form>
  78                 </div>
  79
  80             </div>
  81         </div>
  82     </div>
  83
  84     <div class="row">
  85     </div>
  86
  87
  88     <footer>
  89         A project by <a href="https://xangelo.ca">xangelo</a>
  90     </footer>
  91 </body>
  92 </html>