From 6fce13ca8ae32e1ee5fd338558cbd1db51e77db5 Mon Sep 17 00:00:00 2001
From: Andrea Pasquale <andreapasquale97@gmail.com>
Date: Mon, 9 Dec 2024 21:10:28 +0100
Subject: [PATCH] chore: Some improvements in template.html

---
 src/qibocal/web/templates/template.html | 43 ++++++++++++++++++-------
 1 file changed, 32 insertions(+), 11 deletions(-)
diff --git a/src/qibocal/web/templates/template.html b/src/qibocal/web/templates/template.html
index 414dd1696..da1291d1c 100644
--- a/src/qibocal/web/templates/template.html
+++ b/src/qibocal/web/templates/template.html
@@ -32,11 +32,18 @@
 <body>
 
   <header class="navbar navbar-dark sticky-top p-0">
-    <a class="navbar-brand col-md-3 col-lg-2 me-0 px-3 fs-6" href="/"><span class="fs-4">Qibocal Reports</span></a>
+    <a class="navbar-brand col-md-3 col-lg-2 me-0 px-3 fs-6"><span class="fs-4">Qibocal Reports</span></a>
     <button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-bs-toggle="collapse"
       data-bs-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">
       <span class="navbar-toggler-icon"></span>
     </button>
+    <a href="https://github.com/qiboteam/qibocal" target="_blank" class="btn p-0 border-0 bg-transparent me-3">
+      <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="white" class="bi bi-github"
+        viewBox="0 0 16 16">
+        <path
+          d="M8 0C3.58 0 0 3.58 0 8a8 8 0 0 0 5.47 7.6c.4.074.547-.174.547-.387 0-.191-.007-.696-.01-1.366-2.226.483-2.695-1.073-2.695-1.073-.364-.922-.89-1.167-.89-1.167-.727-.497.055-.487.055-.487.803.056 1.226.825 1.226.825.714 1.223 1.872.87 2.33.665.072-.517.28-.87.508-1.07-1.777-.202-3.644-.889-3.644-3.953 0-.872.311-1.587.824-2.146-.083-.203-.357-1.02.078-2.127 0 0 .672-.215 2.2.82a7.684 7.684 0 0 1 4.004 0c1.527-1.035 2.2-.82 2.2-.82.435 1.107.161 1.924.079 2.127.513.559.824 1.274.824 2.146 0 3.072-1.869 3.748-3.653 3.947.287.247.543.735.543 1.482 0 1.07-.01 1.933-.01 2.194 0 .215.145.466.55.387A8 8 0 0 0 16 8c0-4.42-3.58-8-8-8z" />
+      </svg>
+    </a>
   </header>
 
   <div class="container-fluid">
@@ -46,10 +53,10 @@
         <ul class="list-unstyled ps-0">
           {% if report %}
           <li class="mb-1">
-            <buttom class="btn btn-toggle d-inline-flex align-items-center rounded border-0" data-bs-toggle="collapse"
+            <button class="btn btn-toggle d-inline-flex align-items-center rounded border-0" data-bs-toggle="collapse"
               data-bs-target="#home-collapse" aria-expanded="true">
               Home
-            </buttom>
+            </button>
             <div class="collapse show" id="home-collapse">
               <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
                 <li><a href="#" class="link-dark d-inline-flex text-decoration-none rounded">
@@ -60,24 +67,38 @@
           <li class="mb-1">
             <button class="btn btn-toggle d-inline-flex align-items-center rounded border-0" data-bs-toggle="collapse"
               data-bs-target="#actions-collapse" aria-expanded="true">
-              Actions
+              Protocols
             </button>
             <div class="collapse show" id="actions-collapse">
               {% for task_id in report.history  %}
                 <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
                   <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
                     <li><a class="link-dark d-inline-flex text-decoration-none rounded"
-                        href="#{{report.routine_name(task_id)}}"> {{report.routine_name(task_id)}}</a></li>
+                        href="#{{report.routine_name(task_id)}}"> {{report.routine_name(task_id)}}</a>
+                        {% for target in report.routine_targets(task_id) %}
+                        <div class="collapse show" id="action-collapse">
+                          <ul class="list-unstyled ps-4">
+                            <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
+                              <li><a class="link-dark d-inline-flex text-decoration-none rounded"
+                                href="#{{ task_id }}-{{ target }}"> Target {{target}}</a>
+                                </li>
+                            </ul>
+                          </ul>
+                          {% endfor %}
+                          </div>
+
+
+                      </li>
                   </ul>
                 </ul>
               {% endfor %}
             </div>
           </li>
           <li class="mb-1">
-            <buttom class="btn btn-toggle d-inline-flex align-items-center rounded border-0" data-bs-toggle="collapse"
+            <button class="btn btn-toggle d-inline-flex align-items-center rounded border-0" data-bs-toggle="collapse"
               data-bs-target="#summary-collapse" aria-expanded="true">
               Summary
-            </buttom>
+            </button>
             <div class="collapse show" id="summary-collapse">
               <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
                 <li><a href="#summary" class="link-dark d-inline-flex text-decoration-none rounded">
@@ -135,7 +156,7 @@ <h1>{{ title }}</h1>
           class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
           {{ report.routine_name(task_id) }}</h4>
         {% for qubit in report.routine_targets(task_id) %}
-        <div id="{{ routine }}-{{ iteration }}-{{ qubit }}" style="scroll-margin-top: 4em;">
+        <div id="{{ task_id }}-{{ qubit }}" style="scroll-margin-top: 4em;">
             <h5
               class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
               {{ header }} - Qubit {{ qubit }}</h5>
@@ -156,10 +177,10 @@ <h1>{{ title }}</h1>
         class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
         Summary</h3>
 
-      <p>In the table below we show the libraries and respective versions used in {{ report.title }}.</p>
+      <p>In the table below we show the libraries and respective versions used in {{ report.path }}.</p>
 
-      <div class="table-responsive col-md-5 col-lg-3">
-        <table class="table table-striped table-sm">
+      <div class="table-responsive">
+        <table class="table table-striped table-sm w-100">
           <thead>
             <tr>
               <th scope="col">Library</th>
