[misc] some little corrections

static/css/genealogy.css

@@ -20,7 +20,7 @@
   padding: 2px;
 }
 
-.btn-icon-usable {
+/* .btn-icon-usable {
   color: var(--main-color);
   border: solid 1px var(--main-color);
   padding: 3px;
@@ -30,13 +30,14 @@
   cursor: pointer;
   color: white;
   background-color: var(--main-color);
-}
+} */
 
 
 /****************
   btn in graph
 ****************/
 .cy-panzoom {
+  position: fixed !important;
   width: fit-content;
   height: fit-content;
   right: 0;
@@ -46,8 +47,9 @@
 .cy-panzoom-zoom-button {
   position: relative;
   top: 0 !important;
-  width: fit-content;
-  height: fit-content;
+  left: 0;
+  width: 2em;
+  height: 2em;
   margin-bottom: 1em;
   color: var(--main-color);
   border: solid 1px var(--main-color);
@@ -62,3 +64,9 @@
 .icon {
   font-size: 2em;
 }
+
+hr{
+  height: 2px !important;
+  color: var(--main-color);
+  opacity: 1;
+}

static/css/main.css

@@ -146,7 +146,6 @@ body {
 }
 
 
-
 /****************
     navbar
 ****************/
@@ -160,15 +159,8 @@ body {
 }
 
 .btn-menu:hover{
-  /* color : #ffffff;
-  background-color: var(--main-color); */
-
-  /* solution 1 */
   color: var(--main-color);
   background-color: white;
-  /* solution 2 */
-  /* color: white;
-  border-color: white; */
 }
 .btn-menu.dropdown-item:hover {
   color: white;

static/js/chapter.js

@@ -23,7 +23,7 @@ window.onload = function() {
   }
 
   // chapterHandler.init();
-  chapterInit();
+  exploreInit();
   imageHandler.init();
   pageInit();
 
@@ -37,14 +37,6 @@ window.onclick = function() {
   }
 }
 
-// Stop fix navbar + hide footer
-function chapterInit() {
-  var navbar = document.getElementsByClassName("navbar")[0];
-  navbar.classList.remove("sticky-top");
-  var footer = document.getElementsByClassName("footer")[0];
-  footer.style.display = "none";
-}
-
 // Scroll to a specific page and a specific verse if they are in url
 function pageInit(){
   // if page nb in url : simulate a click on thumbnail

static/js/graph.js

@@ -109,7 +109,6 @@ let handler = {
         // Resize container in function of graph size
         cy.container().style.height = "2250px";
         cy.resize();
-        // cy.layout(layout).run()
 
         // Zoom on a specific node and its childs
         cy.unbind("click");
@@ -161,18 +160,19 @@ let handler = {
         // add the panzoom control
         cy.panzoom(defaults);
 
-        // Ajout du bouton refresh à la suite de la gestion de zoom
-        // penser à ajouter le 'onclick' si on utilise ça
-        // panzoom = document.getElementsByClassName("cy-panzoom")[0];
-        // div = document.createElement("div");
-        // div.classList.add("cy-panzoom-zoom-button");
-        // span = document.createElement("span");
-        // span.classList.add("icon");
-        // span.classList.add("fa");
-        // span.classList.add("fa-rotate");
-        // div.appendChild(span);
-        // console.log(panzoom);
-        // panzoom.appendChild(div);
+        // Add refresh bttn
+        panzoom = document.getElementsByClassName("cy-panzoom")[0];
+        var hr = document.createElement("hr");
+        panzoom.appendChild(hr);
+        div = document.createElement("div");
+        div.classList.add("cy-panzoom-zoom-button");
+        span = document.createElement("span");
+        span.classList.add("icon");
+        span.classList.add("fa");
+        span.classList.add("fa-rotate");
+        span.setAttribute("onclick","window.location.reload()");
+        div.appendChild(span);
+        panzoom.appendChild(div);
 
       });
     });
@@ -181,8 +181,5 @@ let handler = {
 
 window.onload = function() {
   handler.init();
-
-  // Hide footer
-  var footer = document.getElementsByClassName("footer")[0];
-  footer.style.display = "none";
+  exploreInit();
 }

static/js/main.js

+// Stop fix navbar + hide footer
+function exploreInit() {
+  var navbar = document.getElementsByClassName("navbar")[0];
+  navbar.classList.remove("sticky-top");
+  var footer = document.getElementsByClassName("footer")[0];
+  footer.style.display = "none";
+}

templates/base.html.j2

@@ -54,6 +54,7 @@
     </div>
 
     <script src="{{ url_for('static', filename='js/libs/bootstrap.bundle.min.js') }}"></script>
+    <script src="{{ url_for('static', filename='js/main.js') }}"></script>
     {% block js %}{% endblock %}
   </body>
 </html>

templates/genealogy.html.j2

@@ -13,7 +13,7 @@
 {% block containertype %}container{% endblock %}
 
 {% block body %}
-<div class="row">
+  <div class="row">
     <div class="col" id="instructions">
       <p>Plusieurs possibilités pour manipuler le graphe :</p>
       <ul>
@@ -23,13 +23,11 @@
         <li>Le bouton <i class="fa-solid fa-expand btn-icon"></i> permet de réinitialiser le zoom et de recentrer le graphe.</li>
         <li>Maintenir appuyé sur un noeud en déplaçant la souris permet de déplacer le noeud et de modeler le graphique à sa guise.</li>
         <li>Cliquer sur un noeud coupe le graphe et le centre sur la descendance de ce noeud.</li>
-        <li>Cliquer sur ce bouton <i class="fa-solid fa-rotate btn-icon-usable" onclick="window.location.reload()"></i> ré-initialise le graphe tel qu'il était avant d'être manipulé.</li>
+        <li>Cliquer sur ce bouton <i class="fa-solid fa-rotate btn-icon" onclick="window.location.reload()"></i> pour ré-initialiser le graphe tel qu'il était avant d'être manipulé.</li>
       </ul>
     </div>
   </div>
-  <div class="row">
-    <div class="col justify-content-center" id="graph">
-    </div>
+  <div class="row justify-content-center" id="graph">
   </div>
 {% endblock %}