{% autoescape false %}
<div class="container">
<div class="jumbotron" id="overview">
  <h1><i class="fa fa-users me-3"></i>Users</h1>
    <div class="row justify-content-md-center">
        <p class="lead col">Manage Baïkal user accounts, and associated resources.</p>
        <p class="lead col-lg-2 text-end"><a class="btn btn-secondary" href="{{ controller.linkNew() }}"><i class="{{ usericon }}"></i> + Add user</a></p>
    </div>
</div>

<table class="table users">
	{% for user in users %}
	<tr>
		<td class="col-username">
			<i class="{{ usericon }}"></i> <strong>{{ user.username|escape }}</strong><br />
			{{ user.displayname|escape }} <a href="{{ user.mailtouri|escape }}">&lt;{{ user.email|escape }}&gt;</a>
		</td>
		<td class="col-actions text-end">
		  <nobr><span class="btn btn-light popover-hover" data-bs-placement="bottom" data-bs-toggle="popover" title="Setup info" data-bs-content="<b>URI</b><br/><span class='copy-to-clipboard'>{{ davUri }}<i class='fa fa-copy'></i></span><br><br><b>User name</b><br/><span class='copy-to-clipboard'>{{ user.username|escape }}<i class='fa fa-copy'></i></span><br><br><b>Password</b><br/><em>(hidden)</em>" data-html="true"><i class="fa fa-circle-info"></i></span></nobr>
			<nobr><a class="btn btn-light" href="{{ user.linkcalendars }}"><i class="{{ calendaricon }}"></i> Calendars</a></nobr>
			<nobr><a class="btn btn-light" href="{{ user.linkaddressbooks }}"><i class="fa fa-book"></i> Address Books</a></nobr>
			<nobr><a class="btn btn-primary" href="{{ user.linkedit }}"><i class="fa fa-edit"></i>  Edit</a></nobr>
			<nobr><a class="btn btn-danger" href="{{ user.linkdelete }}"><i class="fa fa-remove"></i> Delete</a></nobr>
		</td>
	</tr>
	{% endfor %}
</table>

<a id='form'></a>
{{ messages }}
{{ form }}
</div>
{% endautoescape %}