{% include 'mcp_header.html' %}

<div class="iz-mcp">

	<section class="iz-card iz-card--mcp" aria-labelledby="iz-warn-user-title">
		<header class="iz-card__header">
			<h2 class="iz-card__title" id="iz-warn-user-title">{{ L_WARN_USER }}</h2>
		</header>

		<div class="iz-card__body">
			<form method="post" id="mcp" action="{{ U_POST_ACTION }}" class="iz-form">
				<div class="iz-field">
					<div class="iz-field__row">
						<label class="iz-label" for="username">{{ L_SELECT_USER }}{{ L_COLON }}</label>
						<a class="iz-link iz-link--muted"
						   href="{{ U_FIND_USERNAME }}"
						   onclick="find_username(this.href); return false;">
							{{ L_FIND_USERNAME }}
						</a>
					</div>

					<input class="iz-input" type="text" name="username" id="username" autocomplete="off" />
				</div>

				<fieldset class="iz-actions iz-actions--inline">
					<button type="submit" name="submituser" value="{{ L_SUBMIT }}" class="iz-btn iz-btn--primary">
						{{ L_SUBMIT }}
					</button>
					{{ S_FORM_TOKEN }}
				</fieldset>
			</form>
		</div>
	</section>


	<section class="iz-card iz-card--mcp" aria-labelledby="iz-most-warnings-title">
		<header class="iz-card__header">
			<h2 class="iz-card__title" id="iz-most-warnings-title">{{ L_MOST_WARNINGS }}</h2>
		</header>

		<div class="iz-card__body">
			{% if highest %}
				<div class="iz-table" role="region" aria-label="{{ L_MOST_WARNINGS }}">
					<table class="iz-table__table">
						<thead class="iz-table__head">
							<tr class="iz-table__row">
								<th scope="col" class="iz-table__th iz-table__th--grow">{{ L_USERNAME }}</th>
								<th scope="col" class="iz-table__th">{{ L_WARNINGS }}</th>
								<th scope="col" class="iz-table__th">{{ L_LATEST_WARNING_TIME }}</th>
							</tr>
						</thead>

						<tbody class="iz-table__body">
							{% for highest in highest %}
								<tr class="iz-table__row">
									<td class="iz-table__td">{{ highest.USERNAME_FULL }}</td>
									<td class="iz-table__td">
										{{ highest.WARNINGS }}
										&nbsp;&#91;<a class="iz-link" href="{{ highest.U_NOTES }}">{{ L_VIEW_NOTES }}</a>&#93;
									</td>
									<td class="iz-table__td"><time>{{ highest.WARNING_TIME }}</time></td>
								</tr>
							{% endfor %}
						</tbody>
					</table>
				</div>
			{% else %}
				<p class="iz-alert iz-alert--info" role="status">{{ L_NO_WARNINGS }}</p>
			{% endif %}
		</div>
	</section>


	<section class="iz-card iz-card--mcp" aria-labelledby="iz-latest-warnings-title">
		<header class="iz-card__header">
			<h2 class="iz-card__title" id="iz-latest-warnings-title">{{ L_LATEST_WARNINGS }}</h2>
		</header>

		<div class="iz-card__body">
			{% if latest %}
				<div class="iz-table" role="region" aria-label="{{ L_LATEST_WARNINGS }}">
					<table class="iz-table__table">
						<thead class="iz-table__head">
							<tr class="iz-table__row">
								<th scope="col" class="iz-table__th iz-table__th--grow">{{ L_USERNAME }}</th>
								<th scope="col" class="iz-table__th">{{ L_TOTAL_WARNINGS }}</th>
								<th scope="col" class="iz-table__th">{{ L_TIME }}</th>
							</tr>
						</thead>

						<tbody class="iz-table__body">
							{% for latest in latest %}
								<tr class="iz-table__row">
									<td class="iz-table__td">{{ latest.USERNAME_FULL }}</td>
									<td class="iz-table__td">
										{{ latest.WARNINGS }}
										&nbsp;&#91;<a class="iz-link" href="{{ latest.U_NOTES }}">{{ L_VIEW_NOTES }}</a>&#93;
									</td>
									<td class="iz-table__td"><time>{{ latest.WARNING_TIME }}</time></td>
								</tr>
							{% endfor %}
						</tbody>
					</table>
				</div>
			{% else %}
				<p class="iz-alert iz-alert--info" role="status">{{ L_NO_WARNINGS }}</p>
			{% endif %}
		</div>
	</section>

</div>

{% include 'mcp_footer.html' %}