<!DOCTYPE html>
<html lang="en">
  <%- include('head.ejs') %>

  <body>
    <noscript> Please turn on JavaScript or change browsers!</noscript>

    <%- include('header.ejs') %>

    <main class="container login-form" role="main">
      <form class="shadow" action="/register" method="POST">
        <div class="form-group">
          <h2 class="text-center">Register</h2>

          <input
            type="text"
            class="form-control"
            name="name"
            placeholder="Full name"
            minlength="6"
            maxlength="20"
            autocomplete="off"
            required
          />
        </div>

        <div class="form-group">
          <input
            type="email"
            class="form-control"
            name="email"
            placeholder="your@email.com"
            minlength="4"
            maxlength="25"
            required
          />
        </div>

        <div class="form-group">
          <input
            type="password"
            class="form-control"
            name="password"
            placeholder="password"
            minlength="4"
            maxlength="20"
            autocomplete="new-password"
            required
          />
        </div>

        <div class="form-group">
          <label>
            Over 17:
            <select class="form-control" name="active">
              <option value="1" selected>Yes</option>
              <option value="0">No</option>
            </select>
          </label>

          <input
            type="submit"
            class="btn btn-outline-success form-control"
            value="Sign up"
          />
        </div>
      </form>

      <p class="text-center text-danger">
        <% if (err === "yes") { %> You need to be over 18, in order to our
        services. <% } else if (err === "no") { %> User already registered in
        database, head to
        <a href="/login">log in</a>. <% } %>
      </p>
    </main>

    <%- include('footer.ejs') %>
  </body>
</html>
