diff --git a/public/analytics.js b/public/analytics.js
index aaa8165f..cdec50b7 100644
--- a/public/analytics.js
+++ b/public/analytics.js
@@ -807,10 +807,17 @@
- ${renderTable(d2, 'Pairs (2-hop links)')}
- ${renderTable(d3, 'Triples (3-hop chains)')}
- ${renderTable(d4, 'Quads (4-hop chains)')}
- ${renderTable(d5, 'Long chains (5+ hops)')}
+
+ ${renderTable(d2, 'Pairs (2-hop links)')}
+ ${renderTable(d3, 'Triples (3-hop chains)')}
+ ${renderTable(d4, 'Quads (4-hop chains)')}
+ ${renderTable(d5, 'Long chains (5+ hops)')}
Select a route to view details
@@ -826,6 +833,15 @@
loadSubpathDetail(tr.dataset.hops);
});
+ // Jump nav — scroll within list panel
+ el.querySelectorAll('.subpath-jump-nav a').forEach(a => {
+ a.addEventListener('click', e => {
+ e.preventDefault();
+ const target = document.getElementById(a.getAttribute('href').slice(1));
+ if (target) target.scrollIntoView({ behavior: 'smooth', block: 'start' });
+ });
+ });
+
// Collision toggle
const toggle = document.getElementById('hideCollisions');
function applyCollisionFilter() {
diff --git a/public/style.css b/public/style.css
index a400cf4a..a5575519 100644
--- a/public/style.css
+++ b/public/style.css
@@ -1178,3 +1178,9 @@ tr[data-hops]:hover { background: rgba(59,130,246,0.1); }
.subpath-layout { flex-direction: column; height: auto; }
.subpath-detail { width: 100%; border-left: none; border-top: 1px solid var(--border, #e5e7eb); }
}
+
+/* Subpath jump nav */
+.subpath-jump-nav { display: flex; gap: 8px; align-items: center; margin-bottom: 16px; font-size: 0.9em; flex-wrap: wrap; }
+.subpath-jump-nav span { color: #9ca3af; }
+.subpath-jump-nav a { padding: 4px 12px; border-radius: 4px; background: var(--accent, #3b82f6); color: #fff; text-decoration: none; font-size: 0.85em; }
+.subpath-jump-nav a:hover { opacity: 0.8; }