<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="David Prihoda">
    <title>{{ title + ' - ' if title else '' }}BioPhi Antibody design platform</title>

    <!-- Bootstrap core CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css" rel="stylesheet"
          integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">

    <link rel="icon" href="{{ url_for('static', filename='img/logo-light/1x/biophi_symbol.png') }}" sizes="32x32" type="image/png">

    <meta property="og:image" content="{{ url_for('static', filename='img/preview.png') }}" />

    <!-- Custom styles for this template -->
    <link href="{{ url_for('static', filename='bio.css') | autoversion }}" rel="stylesheet">
    <link href="{{ url_for('static', filename='main.css') | autoversion }}" rel="stylesheet">
    <link href="{{ url_for('static', filename='forms.css') | autoversion }}" rel="stylesheet">
    {% block head %}
    {% endblock %}

  </head>
  <body>

    <nav class="navbar sticky-top navbar-expand-sm navbar-dark bg-dark">
      <div class="container-fluid">
        <a class="navbar-brand" href="/">
          <img src="{{ url_for('static', filename='img/logo-dark/1x/biophi_logo.png') }}" height="26" width="117" />
        </a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
          <div class="navbar-nav">
            <a class="nav-link {% if active_nav == 'humanness' %}active{% endif %}" href="/humanization/humanness">Humanness report</a>
            <a class="nav-link {% if active_nav == 'humanize' %}active{% endif %}" href="/humanization/humanize">Humanize</a>
            <a class="nav-link {% if active_nav == 'designer' %}active{% endif %}" href="/humanization/designer">Designer</a>
          </div>
        </div>
        <div class="d-flex navbar-nav">
          {% if BANNER_HTML %}
            <span class="nav-custom-banner">{{ BANNER_HTML | safe }}</span>
          {% endif %}
          <a href="#" class="nav-link" data-bs-toggle="modal" data-bs-target="#helpModal">Help</a>
        </div>
      </div>
    </nav>
    {% block header %}
    {% endblock %}

    {% block container %}
    {% endblock %}

    <div id="footer"></div>

    {% block help_modal %}
    <div class="modal fade" id="helpModal" tabindex="-1" aria-hidden="true">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Help</h5>
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body">
            {% block help %}
              Please report any issues <a target="_blank" href="https://github.com/Merck/BioPhi/issues">here</a>.
            {% endblock %}
          </div>
        </div>
      </div>
    </div>
    {% endblock %}

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.bundle.min.js"
            integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf" crossorigin="anonymous"></script>
    <script type="text/javascript" charset="utf8" src="{{ url_for('static', filename='common.js') | autoversion }}"></script>
    {% block scripts %}
    {% endblock %}
  </body>
</html>
