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

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

{% block content %}
<section class="portfolio-block contact">
    <div class="container">
        <div class="heading">
          <h1>Voter List</h1>
          <h4>The following voters are able to cast ballots in the election.</h4>
        </div>
        <table class="table table-hover">
          <thead>
            <tr>
              <th scope="col">#</th>
              <th scope="col">Name</th>
              <th scope="col">Email</th>
            </tr>
          </thead>
          <tbody>
            {% for voter in election.voters %}
              <tr>
                <th scope="row">{{ loop.index }}</th>
                <td>{{ voter.name | suppress_none }}</td>
                <td>{{ voter.email }}</td>
              </tr>
            {% endfor %}
          </tbody>
        </table>
    </div>
</section>
{% endblock %}