<%- include('../includes/head.ejs') %>
<link rel="stylesheet" href="/css/auth.css">
<link rel="stylesheet" href="/css/forms.css">
</head>

<body>
<%- include('../includes/navigation.ejs') %>

<main>
  <div class="centered">
    <h1>Login</h1>
  </div>
  <% if (errorMessage) { %>
    <div class="user-message user-message__error"><%= errorMessage %></div>
  <% } %>
  <form class="login-form" method="POST" action="/login" novalidate>
    <div class="form-control">
      <label for="email">E-Mail</label>
      <input class="<%= validationErrors.find(e => e.param === 'email') ? 'invalid' : '' %>"
             type="email"
             name="email"
             id="email"
             value="<%= oldInput.email %>">
    </div>
    <div class="form-control">
      <label for="password">Password</label>
      <input class="<%= validationErrors.find(e => e.param ==='password') ? 'invalid' : '' %>"
             type="password"
             name="password"
             id="password"
             value="<%= oldInput.password %>">
      <div class="align-right">
        <a class="reset-password" href="/reset">Forgot Password ?</a>
      </div>
    </div>

    <div class="centered">
      <input type="hidden" name="_csrf" value="<%= csrfToken %>">
      <button class="btn" type="submit">Login</button>
    </div>
  </form>

</main>

<%- include('../includes/end.ejs') %>
</body>
