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 chat 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">Corporations</h3>
  33     <p>All space organizations need a good corporation! We're looking at adding on corporations to the game to allow users to self organize and take control of their sectors</p>
  34     <h3 data-augmented-ui="tl-clip bl-clip none">Species</h3>
  35     <p>
  36         Work is being done to add different Species/Factions to the game to allow further customization and strategy options.
  37     </p>
  38     <h3 data-augmented-ui="tl-clip bl-clip none">Tech Trees</h3>
  39     <p>In addition to building up your army and your colony ship, you can invest in various technologies/skills that will grant you various boosts/side-effects!</p>
  40         </div>
  41         <div class="col">
  42             <div class="row">
  43                 <div class="col pane" data-augmented-ui="tl-clip tr-2-clip-x br-2-clip-y bl-clip-x border">
  44                     <h3 data-augmented-ui="tl-clip bl-clip none">Signup</h3>
  45                     <form hx-post="/accounts" hx-target="#notifications">
  46                         <div>
  47                             <label>Username:</label>
  48                             <input type="text" name="username">
  49                         </div>
  50                         <div>
  51                             <label>Password:</label>
  52                             <input type="password" name="password">
  53                         </div>
  54                         <button type="submit" class="success">Sign Up</button>
  55                     </form>
  56                 </div>
  57             </div>
  58             <div class="row">
  59                 <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">
  60                     <h3 data-augmented-ui="tl-clip bl-clip none">Login</h3>
  61                     <form hx-post="/login" hx-target="#notifications">
  62                         <div>
  63                             <label>Username:</label>
  64                             <input type="text" name="username">
  65                         </div>
  66                         <div>
  67                             <label>Password:</label>
  68                             <input type="password" name="password">
  69                         </div>
  70                         <button type="submit">Log In</button>
  71                     </form>
  72                 </div>
  73
  74             </div>
  75         </div>
  76     </div>
  77
  78     <div class="row">
  79     </div>
  80
  81
  82     <footer>
  83         A project by <a href="https://xangelo.ca">xangelo</a>
  84     </footer>
  85 </body>
  86 </html>