<!DOCTYPE html>
<html lang="de" xmlns:th="https://www.thymeleaf.org/">

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link th:href="@{/styles/dashboard.css}" rel="stylesheet" />
</head>

<body>
    <h1>Wähler Liste</h1>

    <div class="voterTable">
        <table class="tableVoters" border="5">
            <tr>
                <th>Id</th>
                <th>E-Mail</th>
                <th>Vote status</th>
            </tr>

            <tr th:each="voter : ${voters}">
                <!-- If voter has voted -->
                <div th:if="${voter.vote_status}">
                    <td class="voted" th:text="${voter.id}"></td>
                    <td class="voted" th:text="${voter.email}"></td>
                    <td class="voted" th:text="${voter.vote_status}"></td>
                </div>

                <!-- ELSE -->
                <div th:unless="${voter.vote_status}">
                    <td class="notVoted" th:text="${voter.id}"></td>
                    <td class="notVoted" th:text="${voter.email}"></td>
                    <td class="notVoted" th:text="${voter.vote_status}"></td>
            </tr>
        </table>
        </div>

        <h1>Kandidaten Liste</h1>
        <div class="candidateTable">
            <table class="tableCandidates" border="5">
                <tr>
                    <th>Id</th>
                    <th>Name</th>
                    <th>Votes</th>
                    <th>Category</th>
                </tr>

                <tr th:each="candidate: ${candidates}">
                    <td th:text="${candidate.id}"></td>
                    <td th:text="${candidate.name}"></td>
                    <td th:text="${candidate.votes}"></td>
                    <td th:text="${candidate.category}"></td>
                </tr>
            </table>
        </div>
</body>

</html>