Ranking provincial

_includes/tabla.njk

@@ -51,5 +51,5 @@ https://websegura.pucelabits.org'| urlEncode }}{{ path }}{{ '?pk_campaign=Hazsel
         {% endfor %}
       </tbody>
     </table>
-    <p class="tablefooter">(Las notas se actualizan diariamente)</p>
-  {% endmacro %}
+    <p class="tablefooter">(Las notas se actualizan cada 3 días)</p>
+  {% endmacro %}

assets/js/main.js

@@ -183,6 +183,9 @@
 			});
 
 			// Custom code
-			let progress = $('.score-progress').attr("data-score") + '%';
-			$('.score-progress').css('width', progress);
+			$( ".score-progress" ).each( function () {
+			    let progress = $(this).attr("data-score") + '%';
+			    $(this).css('width', progress);
+			});
+
 })(jQuery);

assets/sass/main.scss

@@ -83,6 +83,10 @@ small {
   font-size: 0.85em;
 }
 
+section {
+  margin-bottom: 1em;
+}
+
 #main p.button {
   display: block;
   max-width: 390px;
@@ -159,6 +163,14 @@ p.subtitle {
   }
 }
 
+#ranking-provincial {
+  column-count: 2;
+
+  .score-container {
+    margin: 1em 0;
+  }
+}
+
 p.centered {
   text-align: center;
 }

pages/ranking.njk

@@ -11,8 +11,13 @@ title: "Ranking: Las mejores y las peores webs"
   -
   {{ title }}</p>
 
-<h1>🏆
-  {{ title }}</h1>
+<h1>🏆 {{ title }}</h1>
+
+<ul>
+  <li><a href="#hall-of-fame">🎖️ Hall de la fama</a></li>
+  <li><a href="#hall-of-shame">☠️ Hall de la vergüenza</a></li>
+  <li><a href="#ranking-provincial">📊 Ranking provincial</a></li>
+</ul>
 
 <section>
   <div class="table-wrapper" id="resultados">
@@ -24,4 +29,16 @@ title: "Ranking: Las mejores y las peores webs"
     <p>Estos sitios son completamente inseguros, ¡no implementan ninguna medida de seguridad!</p>
     {{ tabla(all | testsPassedLt(5), path=page.url) }}
   </div>
+
+  <h2>📊 Ranking provincial</h2>
+  <div class="table-wrapper" id="ranking-provincial">
+      {% for code, p in provincias %}
+        <div class="score-container" title="{{ all | filterByTerritorioId(code)| safeScore }}% de las webs completamente seguras">
+          <a href="/p/{{ code }}/">{{ p.name }}</a>
+          <div class="score-bar">
+            <div class="score-progress" data-score="{{ all | filterByTerritorioId(code)| safeScore }}"></div>
+          </div>
+        </div>
+      {% endfor %}
+  </div>
 </section>