fix menu

comparador.html

@@ -23,18 +23,8 @@
         <nav class="navegacion menu--inola">
             <a href="https://casacaida.co" class="navegacion-btn menu__item">
                 <span class="menu__item-name">Portada</span>
-            </a>
-            <a href="https://casacaida.co/evolucion.html#zaragoza" class="navegacion-btn menu__item">
-                <span class="menu__item-name">Evolución Zaragoza</span>
-            </a>
-            <a href="https://casacaida.co/evolucion.html#huesca" class="navegacion-btn menu__item">
-                <span class="menu__item-name">Evolución Huesca</span>
-            </a>
-            <a href="https://casacaida.co/evolucion.html#teruel" class="navegacion-btn menu__item">
-                <span class="menu__item-name">Evolución Teruel</span>
-            </a>
-            <a href="#enlaces" class="navegacion-btn menu__item">
-                <span class="menu__item-name">Enlaces de interés</span>
+            <a href="https://casacaida.co/evolucion.html" class="navegacion-btn menu__item">
+                <span class="menu__item-name">Evolución 2011-2019</span>
             </a>
             <a href="https://github.com/jorgeatgu/la-casa-caida" class="navegacion-btn menu__item">
                 <span class="menu__item-name">GitHub</span>

evolucion.html

@@ -31,6 +31,9 @@
             <a href="https://casacaida.co/evolucion.html#teruel" class="navegacion-btn menu__item">
                 <span class="menu__item-name">Evolución Teruel</span>
             </a>
+            <a href="https://casacaida.co/comparador" class="navegacion-btn menu__item">
+                <span class="menu__item-name">Comparador</span>
+            </a>
             <a href="#enlaces" class="navegacion-btn menu__item">
                 <span class="menu__item-name">Enlaces de interés</span>
             </a>

index.html

@@ -35,6 +35,9 @@
             <a href="https://casacaida.co/evolucion.html" class="navegacion-btn menu__item">
                 <span class="menu__item-name">Evolución 2011-2019</span>
             </a>
+            <a href="https://casacaida.co/comparador" class="navegacion-btn menu__item">
+                <span class="menu__item-name">Comparador</span>
+            </a>
             <a href="#enlaces" class="navegacion-btn menu__item">
                 <span class="menu__item-name">Enlaces de interés</span>
             </a>

now.json

@@ -1,7 +1,20 @@
 {
-    "name": "La casa caida",
-    "version": 2,
-    "alias": [
-        "casacaida.co"
-    ]
+  "name": "La casa caida",
+  "version": 2,
+  "alias": [
+    "casacaida.co"
+  ],
+  "routes": [
+  {
+    "src": "^/",
+    "dest": "/index.html"
+  },
+  {
+    "src": "^/comparador",
+    "dest": "/comparador.html"
+  },
+  {
+    "src": "^/evolucion",
+    "dest": "/evolucion.html"
+  }]
 }

src/css/_comarcas.css

@@ -44,6 +44,10 @@
   .ss-main .ss-content {
     margin-left: 0 !important;
   }
+  header {
+    position: relative;
+    z-index: 100;
+  }
 }
 
 .container-comparador {

src/js/comparador.js

@@ -1,5 +1,37 @@
 const widthMobile = window.innerWidth > 0 ? window.innerWidth : screen.width;
 
+function menu() {
+    var overlay = document.querySelector('.overlay');
+    var navigation = document.querySelector('.navegacion');
+    var body = document.querySelector('body');
+    var elementBtn = document.querySelectorAll('.navegacion-btn');
+    var burger = document.querySelector('.burger');
+
+    function classToggle() {
+        burger.classList.toggle('clicked');
+        overlay.classList.toggle('show');
+        navigation.classList.toggle('show');
+        body.classList.toggle('overflow');
+    }
+
+    document.querySelector('.burger').addEventListener('click', classToggle);
+    document.querySelector('.overlay').addEventListener('click', classToggle);
+
+    for (i = 0; i < elementBtn.length; i++) {
+        elementBtn[i].addEventListener('click', function() {
+            removeClass();
+        });
+    }
+
+    function removeClass() {
+        overlay.classList.remove('show');
+        navigation.classList.remove('show');
+        burger.classList.remove('clicked');
+    }
+}
+
+menu()
+
 function grid() {
     let ciudad;
     const chart = d3.select('.grid-chart-element');
@@ -143,9 +175,15 @@ function grid() {
 
               diferencia = dataz[0].population - 100
 
-              d3.select('.grid-chart-diferencia')
-                .html((d) =>
-                      `<p class="diferencia-habitantes"><span class="numero-diferencia">${dataz[0].name}</span> tiene <span class="numero-diferencia">${diferencia}</span> habitantes más que la manifestación de Vox. `);
+              if (diferencia > 0) {
+                d3.select('.grid-chart-diferencia')
+                  .html((d) =>
+                        `<p class="diferencia-habitantes"><span class="numero-diferencia">${dataz[0].name}</span> tiene <span class="numero-diferencia">${diferencia}</span> habitantes más que la manifestación de Vox. `);
+              } else {
+                d3.select('.grid-chart-diferencia')
+                  .html((d) =>
+                        `<p class="diferencia-habitantes"><span class="numero-diferencia">${dataz[0].name}</span> tiene menos habitantes más que la manifestación de Vox. `);
+              }
 
               updateChart(dataz);
 

src/js/index.js

@@ -51,7 +51,6 @@ function menu() {
     for (i = 0; i < elementBtn.length; i++) {
         elementBtn[i].addEventListener('click', function() {
             removeClass();
-            console.log('click');
         });
     }
 
@@ -1071,9 +1070,6 @@ const barNegative = (csvFile, cities) => {
         const saldoMaxMin = -500;
         const saldoMaxMax = 300;
 
-        console.log(saldoMax)
-        console.log(saldoMin)
-
         const countX = d3.scaleBand().domain(dataz.map((d) => d.year));
 
         const countY = d3