Switch to using cards for trip pay layout

Closes: #125
This commit is contained in:
Edward Betts 2024-01-30 11:07:28 +00:00
parent f3304d0ffe
commit f54c9cfbb7
3 changed files with 53 additions and 7 deletions

View file

@ -2,7 +2,7 @@
{% block title %}{{ trip.title }} ({{ display_date(trip.start) }}){% endblock %}
{% from "macros.html" import trip_link, display_date_no_year, display_date, conference_row, accommodation_row, flight_row, train_row with context %}
{% from "macros.html" import trip_link, display_datetime, display_date_no_year, display_date, conference_row, accommodation_row, flight_row, train_row with context %}
{% set row = { "flight": flight_row, "train": train_row } %}
@ -78,7 +78,8 @@
</p>
<div class="mb-3">
<div>Countries: {{ trip.countries_str }}</div>
{# <div>Countries: {{ trip.countries_str }}</div> #}
<div>Locations: {{ trip.locations_str }}</div>
{% set delta = human_readable_delta(trip.start) %}
{% if delta %}
@ -176,9 +177,50 @@
</div>
{% endfor %}
<div class="travel">
{% for item in trip.travel %} {{ row[item.type](item) }} {% endfor %}
</div>
{% for item in trip.travel %}
<div class="card my-1">
<div class="card-body">
<h5 class="card-title">
{% if item.type == "flight" %}
✈️
{{ item.from_airport.name }} ({{ item.from_airport.iata}})
&rarr;
{{ item.to_airport.name }} ({{item.to_airport.iata}})
{% elif item.type == "train" %}
🚆
{{ item.from }}
&rarr;
{{ item.to }}
{% endif %}
</h5>
<p class="card-text">
{% if item.type == "flight" %}
<div>
<span>{{ item.airline_name }} ({{ item.airline }})</span>
{{ display_datetime(item.depart) }}
&rarr;
{{ item.arrive.strftime("%H:%M %z") }}
<span>{{ ((item.arrive - item.depart).total_seconds() // 60) | int }} mins</span>
<span>{{ item.airline }}{{ item.flight_number }}</span>
</div>
{% elif item.type == "train" %}
<div>
{{ display_datetime(item.depart) }}
&rarr;
{{ item.arrive.strftime("%H:%M %z") }}
{% if item.class %}
<span class="badge bg-info text-nowrap">{{ item.class }}</span>
{% endif %}
<span>{{ ((item.arrive - item.depart).total_seconds() // 60) | int }} mins</span>
</div>
{% endif %}
</p>
</div>
</div>
{% endfor %}
<div class="mt-3">
<h4>Holidays</h4>