<!DOCTYPE html>
<html>
<head>
	<title>Manage Users - Timpani</title>
	<link href="/static/libs/pure/pure-min.css" rel="stylesheet">
</head>
<body>
	{% include "admin_toolbar.html" %}
	<h1>Manage Users...</h1>
	<ul id="users-list">
		{% for user in userList %}
			<li user_id="{{user.id}}" class="user">
				<span class="username">{{user.username}}</span>
			</li>
		{% endfor %}

</body>
</html>

<!DOCTYPE html>
<html>
<head>
	<title>Manage Users - Timpani</title>
	<link href="/static/libs/pure/pure-min.css" rel="stylesheet">
	<link href="/static/css/manage_posts.css" rel="stylesheet">
	<script src="/static/js/modal.js"></script>
</head>
<body>
	{% include "admin_toolbar.html" %}
	<h1>Manage Users...</h1>
	<button id="add-user-button" class="pure-button">Add User</button>
	<ul id="users-list">
		{% for user in userList %}
			<li user_id="{{user.id}}" class="user">
				<span class="username">{{user.username}}</span>
			</li>
		{% endfor %}
	</ul>
	<div class="modal" id="add-user-modal">
		<h3 class="modal-title">Add User</h3>
		<div class="modal-body">
			<input id="username-input" name="username" placeholder="Username" type="text">
			<input id="full-name-input" name="full_name" placeholder="Real name" type="text">
			<input id="password-input" name="password" placeholder="Password" type="password">
			<input id="confirm-password-input" name="confirm-password" placeholder="Confirm Password" type="password">
			<input id="can-change-settings-checkbox" name="can_change_settings" type="checkbox">
			<label for="can-change-settings-checkbox">User can change settings</label>
			<input id="can-write-posts-checkbox" name="can_write_settings" type="checkbox">
			<label for="can-write-posts-checkbox">User can write, edit and delete posts</label>
		</div>
		<div class="modal-buttons">
			<button class="pure-button neutral">Cancel</button>
			<button class="pure-button-primary positive">Add</button>
		</div>
	</div>

</body>
</html>

Add structure for add user modal
Add structure for add user modal
