<!DOCTYPE html>
<html>
  <head>
    <title>ProtoTurk - Task {{ task_id }}</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

    <link rel="stylesheet" href="/static/bootstrap-4.3.1.min.css">
    <style>
    html, body {
      height: 100%;
    }
    body {
      display: flex;
      flex-flow: column;
    }
    .content {
      flex: 1;
    }
    </style>
  </head>
  <body>
    <div class="container-fluid content">
      <nav class="navbar navbar-dark bg-dark">
        <span class="navbar-brand">
          ProtoTurk - Task {{ task_id }}
        </span>
        <ul class="navbar-nav">
          <li class="nav-item">
            <a class="nav-link" href="/">Task List</a>
          </li>
        </ul>
      </nav>
      <iframe src="/task/{{ task_id }}/iframe"
              style="top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0; box-sizing: inherit; display: block;">
      </iframe>
    </div><!-- /.container-fluid -->
  </body>
</html>
