dashboard: shorten long figures title

1 files changed, 6 insertions, 0 deletions

diff --git a/src/api/dashboard/dashboard.html b/src/api/dashboard/dashboard.html
index ee22b3e..afb8ea5 100644
--- a/src/api/dashboard/dashboard.html
+++ b/src/api/dashboard/dashboard.html
@@ -108,6 +108,9 @@
   #map { grid-area: map; }
   #peers-box { grid-area: peers; }
   #figures-box { grid-area: figures; }
+  /* Its title on one line: what doesn't fit ends in an ellipsis (the whole of it its
+     tooltip). */
+  #figures-box h2 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
   #document-box { grid-area: document; }
   #console-box { grid-area: console; }
   #console-box .scroll { flex: 1; }
@@ -449,6 +452,7 @@ function renderStats() {
     const field = (key, value) => el("div", { class: "leaf" },
       el("span", { class: "key" }, key + ": "), value);
     title.replaceChildren("Message: ", what);
+    title.title = title.textContent;
     document.getElementById("stats").replaceChildren(
       field("at", clockTime(new Date(message.at))),
       field(message.way === "received" ? "from" : "to", message.peer),
@@ -487,6 +491,7 @@ function renderStats() {
         destination: peer.destination, addresses: peer.addresses }, "paths"));
     }
     title.replaceChildren("Link: ", what);
+    title.title = title.textContent;
     document.getElementById("stats").replaceChildren(...shown);
     return;
   }
@@ -506,6 +511,7 @@ function renderStats() {
     if (report) shown.push(tree("links", report, "links"));
   }
   title.replaceChildren(focused === null ? "Figures: " : "Peer: ", what);
+  title.title = title.textContent;
   document.getElementById("stats").replaceChildren(...shown);
 }