flight-screen-info/templates/screen.html

67 lines
2.8 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
<title>{{ airport["icao"] }} Departure Schedule</title>
</head>
<body>
<nav class="px-4 flex justify-between bg-yellow-400 h-16">
<ul class="flex items-center">
<li>
<h1 class="pl-8 lg:pl-0 text-white text-2xl">{{ airport["name"] }} Airport Departures</h1>
</li>
</ul>
<ul class="flex items-center">
<li class="h-14 w-14">
<img
class="fill-current h-14 w-14"
src="https://skyscreen.aero/static/images/skyscreen-icon-only-white.png"
alt="Skyscreen Logo"/>
</li>
</ul>
</nav>
<div class="relative overflow-x-auto">
<table class="w-full text-sm text-left rtl:text-right text-gray-500">
<thead class="text-xs text-gray-700 uppercase bg-yellow-400">
<tr>
<th scope="col" class="px-6 py-3">Flight</th>
<th scope="col" class="px-6 py-3">Time</th>
<th scope="col" class="px-6 py-3">Delay</th>
<th scope="col" class="px-6 py-3">Airline</th>
<th scope="col" class="px-6 py-3">Destination</th>
<th scope="col" class="px-6 py-3">Remarks</th>
</tr>
</thead>
<tbody>
{% for flight in data %}
<tr class="bg-white border-b">
<td class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap">{{ flight["ident"] }}</td>
<td class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap">{{ flight["scheduled_off"] }}</td>
<td class="px-6 py-4 font-medium text-red-600 whitespace-nowrap">{% if flight["departure_delay"] %}
{{ flight["departure_delay"] }}
{% else %}
{% endif %}
</td>
<td class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap">{{ flight["operator"] }}</td>
<td class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap overflow-scroll scroll-smooth">
{% if flight["destination"]["name"] %}
{{ flight["destination"]["name"] }}
<span class="text-blue-500">{{ flight["destination"]["code_icao"] }}</span> /
<span class="text-green-600">{{ flight["destination"]["code_iata"] }}</span>
{% else %}
{% endif %}
</td>
<td class="px-6 py-4 font-medium text-amber-400 whitespace-nowrap">
{% if flight["status"] != "Scheduled" %}
{{ flight["status"] }}
{% else %}
{% endif %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</body>
</html>