<!DOCTYPE html>
<html>
  <head>
    <title>Abfahrten {{ station }}</title>
    <link
      rel="stylesheet"
      href="{{ url_for('static', filename='styles.css') }}"
    />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap"
      rel="stylesheet"
    />
  </head>
  <body>
    <div class="header-table-container">
      <table id="header", class="header-table">
        <tr>
          <td class="header-station">
            <h1>{{ station }}</h1>
          </td>
          <td class="header-clock">
            <h1 id="clock" >{{ current_time_str }}</h1>      
          </td>
        </tr>
      </table>
    </div>
    <!-- <div class="header-box">
      <h1>{{ station }}</h1>
      <h1 id="clock", class="clock">{{ current_time_str }}</h1>
    </div> -->
    <div class="departure-table-container">
      <table id="departures", class="departure-table"></table>
    </div>
  </body>
  {% for file in js_files %}
  <script type="text/javascript" src="{{file}}"></script>
  {% endfor %}
</html>
