<!doctype html>
<html lang="en">
<head>
	{% include 'head.html' %}
</head>

<body>
  {% include 'navbar.html' %}
  <div style="font-size: 16px; font-weight: 300;" class="container mt-5 mb-3" role="main">
    <table id="tableMain" class="table table-striped table-bordered table-sm"
            cellspacing="0">
        <thead>
            <tr>
                <th class="th-sm font-weight-bold">Name</th>
                <th class="th-sm font-weight-bold"></th>
            </tr>
        </thead>
        <tbody>
            {% for u in users %}
            <tr>
               <td style="line-height: 45px;">{{ u.username }}</td>
               <td>
                    <button class="btn btn-danger button-delete-fix"
                            onclick="deleteUser('{{ u.username }}')">
                            x
                    </button>
               </td>
           </tr>
           {% endfor %}
        </tbody>
    </table>    

    <script defer>
        $(document).ready(function () {
            $('#tableMain').DataTable();
            $('.dataTables_length').addClass('bs-select');
        });
    </script>
  </div>
</body>

</html>
