{% extends "layout.html" %}

{% block navigation %}
	<li><a href='{{ url_for('getPitStops') }}'>Home</a></li>
	<li><a href='{{ url_for('createPitStopForm') }}'>Create Pitstop</a></li>
	<li><a href='{{ url_for('getStatistics') }}' class="active">Statistics</a></li>
{% endblock %}	

{% block body %}
	<div class="table-responsive">
		<table class="table table-striped table-bordered table-condensed">
			<tr>
				<th>Number of Pitstops:</th>
				<td>{{ data.count }}</td>
			</tr>
			<tr>
				<th>Logged Distance:</th>
				<td>{{ data.distance }} km</td>
			</tr>
			<tr>
				<th>Average Distance:</th>
				<td>{{ data.averageDistance }} km</td>
			</tr>
			<tr>
				<th>Litres fuelled:</th>
				<td>{{ data.litres }} l</td>
			</tr>
			<tr>
				<th>Average Litres fuelled:</th>
				<td>{{ data.averageListresFuelled }} l</td>
			</tr>
			<tr>
				<th>Average Litres used:</th>
				<td>{{ data.averageListresUsed }} l/100km</td>
			</tr>
		</table>
	</div>
{% endblock %}