{% include "@neodev_anubisbb/header.html" %}
	<div style="height:20rem;display:flex">
		<table style="margin-top:1rem;display:grid;grid-template:auto 1fr/auto auto;gap:0 0.5rem">
			<thead style="border-bottom:1px solid black;padding:0.25rem 0;display:grid;grid-template:1fr/subgrid;grid-column:1/-1">
				<tr id="table-header" style="display:contents">
					<th style="width:4.5rem">Time</th>
					<th style="width:4rem">Iters</th>
				</tr>
				<tr id="table-header-compare" style="display:none">
					<th style="width:4.5rem">Time A</th>
					<th style="width:4rem">Iters A</th>
					<th style="width:4.5rem">Time B</th>
					<th style="width:4rem">Iters B</th>
				</tr>
			</thead>
			<tbody id="results" style="padding-top:0.25rem;display:grid;grid-template-columns:subgrid;grid-auto-rows:min-content;grid-column:1/-1;row-gap:0.25rem;overflow-y:auto;font-variant-numeric:tabular-nums"></tbody>
		</table>
		<div class="centered-div">
			<img id="image" style="width:100%;max-width:256px;" src="{{ static_path }}img/pensive.webp">
			<p id="status" style="max-width:256px">Loading...</p>
			<script async type="module" src="{{ static_path }}js/bench.mjs"></script>
			<div id="sparkline"></div>
			<noscript>
				<p>Running the benchmark tool requires JavaScript to be enabled.</p>
			</noscript>
		</div>
	</div>
	<form id="controls" style="position:fixed;top:0.5rem;right:0.5rem">
		<div style="display:flex;justify-content:end">
			<label for="difficulty-input" style="margin-right:0.5rem">Difficulty:</label> <input id="difficulty-input" type="number" name="difficulty" style="width:3rem">
		</div>
		<div style="margin-top:0.25rem;display:flex;justify-content:end">
			<label for="algorithm-select" style="margin-right:0.5rem">Algorithm:</label> <select id="algorithm-select" name="algorithm"></select>
		</div>
		<div style="margin-top:0.25rem;display:flex;justify-content:end">
			<label for="compare-select" style="margin-right:0.5rem">Compare:</label> <select id="compare-select" name="compare"><option value="NONE">-</option></select>
		</div>
	</form>
{% include "@neodev_anubisbb/footer.html" %}