{% extends "layout.html" %}

{% block navigation %}
	<li><a href='{{ url_for('create_pit_stop_form') }}'>Create Pitstop</a></li>
	<li><a href='{{ url_for('get_statistics') }}' class="active">Statistics</a></li>
	<li><a href='{{ url_for('get_services') }}'>Services</a></li>
{% endblock %}	

{% block body %}
	{{ service_warning() }}

	<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 | round(2) }} km</td>
			</tr>
			<tr>
				<th>Average Distance:</th>
				<td>{{ data.averageDistance | round(2) }} km</td>
			</tr>
			<tr>
				<th>Litres fuelled:</th>
				<td>{{ data.litres | round(2) }} l</td>
			</tr>
			<tr>
				<th>Average Litres fuelled:</th>
				<td>{{ data.averageListresFuelled | round(2) }} l</td>
			</tr>
			<tr>
				<th>Average Litres used:</th>
				<td>{{ data.averageListresUsed | round(2) }} l/100km</td>
			</tr>
		</table>
	</div>
{% endblock %}