{% extends "base.html" %}
{% block content %}

<div class="card mb-4 shadow">
    <div class="card-body">
      <h5 class="card-title">{{ user.name }} - Profile overview</h5>
      <ul class="list-group list-group-flush">
        <li class="list-group-item">id: {{user.id }}</li>
        <li class="list-group-item">total trips: {{ user.number_of_trips }}</li>
        <li class="list-group-item">total CO2 saved: {{user.co2_economies }}</li>
      </ul>
    </div>
</div>
<div class="card mb-4 shadow">
    <div class="card-body">
        <h5 class="card-title">Previous destinations</h5>
        <iframe src="/static/{{ context.map_path }}"></iframe>
    </div>
</div>
<div class="card mb-4 shadow">
    <div class="card-body">
      <h5 class="card-title">Travel overview</h5>
      <ul class="list-group list-group-flush">
        <li class="list-group-item">id: {{user.id }}</li>
        <li class="list-group-item">total trips: {{ user.trips }}</li>
        <li class="list-group-item">total CO2 saved: {{user.total_co2_savings }}</li>
      </ul>
    </div>
</div>
{% endblock %}