{% extends "layouts/election_layout.html" %}

{% block header %}
<title>{{ election.name | title }} | Login</title>
{% endblock %}

{% block content %}

<section class="portfolio-block contact">
    <div class="container">
        <form id="login-form" name="register" method="get">
            <div class="text-center" style="font-size:3em;">Login</div>
            <div class="text-center mb-5">Authorities of the election can login here to manage the election.</div>
            <div class="form-group text-center">
              <input class="form-control item" type="text" name="email" placeholder="Email Address">
            </div>
            <div class="form-group text-center">
              <button id="authenticate" class="btn btn-primary btn-block btn-lg" style="background-color: #0084da;">Authenticate</button>
            </div>
        </form>
    </div>
</section>
{% endblock %}

{% block scripts %}
<script src="{{ url_for('static', filename='js/base64.js') }}"></script>
<script src="{{ url_for('static', filename='js/webauthn.js') }}"></script>
<script>
  $(document).ready(function(){
    $("#authenticate").click(didClickLogin);
  });
</script>
{% endblock %}