<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
</head>
<body>
<div class="m-3">
<ul>
{% for dep, arr in routes %}
<li><a href="{{ url_for("show_route", departure_port=ports[dep], arrival_port=ports[arr]) }}">{{ dep }} - {{ arr }}</a></li>
{% endfor %}
</ul>
</div>
</body>
</html>