<!DOCTYPE html>
<html lang="en">
  <head>
    <title>BiG-SLiCE v{{ g["version"] }}</title>
    <meta charset="utf-8" />
    <meta name="application-name" content="BiG-SLiCE-viz" />
    <meta name="description" content="BiG-SLiCE's result visualization web-app" />
    <meta name="author" content="Satria A. Kautsar" />
    <link rel="shortcut icon" href="{{ url_for('static', filename='img/favicon.ico') }}" />
    <link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet" />
    <link href="{{ url_for('static', filename='css/datatables.min.css') }}" rel="stylesheet" />
    <link href="{{ url_for('static', filename='css/jqcloud.min.css') }}" rel="stylesheet" />
    <link href="{{ url_for('static', filename='css/style.css') }}" rel="stylesheet" />
  </head>
  <body data-gr-c-s-loaded="true" cz-shortcut-listen="true">
    <script type="text/javascript" src="{{ url_for('static', filename='js/svg.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static', filename='js/jquery-3.4.1.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static', filename='js/bootstrap.bundle.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static', filename='js/plotly-latest.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static', filename='js/datatables.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static', filename='js/jqcloud.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static', filename='js/arrower.js') }}"></script>
    <div class="container-fluid">
      <div class="row">
        <!-- mobile:topbar -->
        <div class="d-lg-none d-md-none d-sm-block fixed-top pre-scrollable">
          <div id="layout-topbar" class="collapse bg-white text-center">
            {% include "navigation.html.j2" %}
          </div>
          <nav class="navbar navbar-light float-right">
            <button class="navbar-toggler bg-white" type="button" data-toggle="collapse" data-target="#layout-topbar">
            <span class="navbar-toggler-icon"></span>
            </button>
          </nav>
        </div>
        <!-- desktop:sidebar -->
        <div id="layout-sidebar" class="d-none d-md-inline col-2 bg-white min-vh-100">
          <div class="sticky-top sticky-offset mt-2">
            {% include "navigation.html.j2" %}
          </div>
        </div>
        <!-- body:content -->
        <div id="layout-content" class="container col-10 mt-2 ml-0">
          {% block content %}
          {% endblock %}
        </div>
      </div>
    </div>
    {% include "modal.html.j2" %}
    {% include "copier.html.j2" %}
    <script type="text/javascript">
      $(function () {
        $('[data-toggle="popover"]').popover({
          container: 'body'
        });
      });
    </script>
  </body>
</html>