<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
    <meta name="description" content="">
    <meta name="author" content="Tue Herlau">
    <meta name="generator" content="Unitgrade">
    <title>Unitgrade dashboard</title>

    <link rel="canonical" href="https://getbootstrap.com/docs/5.0/examples/sidebars/">
    <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">
    <script src="https://unpkg.com/xterm@4.11.0/lib/xterm.js"></script>
    <script src="https://unpkg.com/xterm-addon-fit@0.5.0/lib/xterm-addon-fit.js"></script>
    <script src="https://unpkg.com/xterm-addon-web-links@0.4.0/lib/xterm-addon-web-links.js"></script>
    <script src="https://unpkg.com/xterm-addon-search@0.8.0/lib/xterm-addon-search.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css">
<!-- terminal related -->
        <link rel="stylesheet" href="https://unpkg.com/xterm@4.11.0/css/xterm.css"/>
        <script src="https://unpkg.com/xterm@4.11.0/lib/xterm.js"></script>
        <script src="https://unpkg.com/xterm-addon-fit@0.5.0/lib/xterm-addon-fit.js"></script>
        <script src="https://unpkg.com/xterm-addon-web-links@0.4.0/lib/xterm-addon-web-links.js"></script>
        <script src="https://unpkg.com/xterm-addon-search@0.8.0/lib/xterm-addon-search.js"></script>
      <!-- end terminal related -->
    <style>
      .bd-placeholder-img {
        font-size: 1.125rem;
        text-anchor: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
      }

      @media (min-width: 768px) {
        .bd-placeholder-img-lg {
          font-size: 3.5rem;
        }
      }
    </style>
    <!-- Custom styles for this template -->
    <link href="/static/sidebars.css" rel="stylesheet">
        <link href="/static/wz_style_modified.css" rel="stylesheet">
    <script>
      var CONSOLE_MODE = false,
          EVALEX = false, // console mode is possible.
          EVALEX_TRUSTED = true,
          SECRET = "Xbtn32ZR6AqRabFk2a3l";
    </script>
    <link href="/static/unitgrade.css" rel="stylesheet">
  </head>
  <body>


<main>
<div class="flex-shrink-0 p-3 bg-white" style="width: 280px; background-color: #f0f0f0">
<span role="tablist" aria-orientation="vertical">
<div class="d-flex flex-column" style="min-height: calc(100vh - 30px);">
<header>
    <a href="/" class="d-flex align-items-center pb-1 mb-1 link-dark text-decoration-none">
        <!---
        <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor"  class="bi me-2" width="30" height="24" viewBox="0 0 16 16">
            <path d="M8.211 2.047a.5.5 0 0 0-.422 0l-7.5 3.5a.5.5 0 0 0 .025.917l7.5 3a.5.5 0 0 0 .372 0L14 7.14V13a1 1 0 0 0-1 1v2h3v-2a1 1 0 0 0-1-1V6.739l.686-.275a.5.5 0 0 0 .025-.917l-7.5-3.5Z"/>
            <path d="M4.176 9.032a.5.5 0 0 0-.656.327l-.5 1.7a.5.5 0 0 0 .294.605l4.5 1.8a.5.5 0 0 0 .372 0l4.5-1.8a.5.5 0 0 0 .294-.605l-.5-1.7a.5.5 0 0 0-.656-.327L8 10.466 4.176 9.032Z"/>
        </svg>
        -->
        <img src="/static/favicon.ico" width="30px">
        <span class="fs-5 fw-semibold">        Unitgrade</span>&nbsp;
        <span class="badge rounded-pill bg-success" id="status-connected">Connected</span>
        <span class="badge rounded-pill bg-warning text-dark" id="status-connecting">Connecting</span>
    </a>
    <!-- Example single danger button -->
    <div class="dropdown">
        <button class="btn btn-secondary dropdown-toggle btn-sm" style="width: 100%" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
          {{menu_name}}
        </button>
        <ul class="dropdown-menu " aria-labelledby="dropdownMenuButton1">
          {% for a in available_reports.values() %}
               <li><a class="dropdown-item" href="/report/{{a.menu_name}}">{{a.menu_name}}</a></li>
          {% endfor %}
        </ul>
    </div>

</header>

<content>
<section>
      {% block navigation %} {% endblock %}
</section>
</content>
<footer class="mt-auto">
      {% block navigation_footer %}{% endblock %}
</footer>
</div>
    </span>
</div>
  <div class="b-example-divider">
    {% block content %}{% endblock %}
 </div> <!-- example divider ends -->
</main>
<!--
    <script src="../assets/dist/js/bootstrap.bundle.min.js"></script> -->
      <script src="/static/sidebars.js"></script>
      <script src="/static/unitgrade.js"></script>
    <script src="/static/wz_js.js"></script>
  </body>
</html>
