From 61c8b020261d6affb4608793bff3ff97f1163508 Mon Sep 17 00:00:00 2001
From: abccodes <abayercalvert@gmail.com>
Date: Fri, 26 Jun 2026 05:59:50 -0700
Subject: [PATCH] [aidan] ux/canvas-tether: center the browser and view tether
 label on the line

---
 .../src/app/pages/Dashboard/geometry/dashboardTethers.ts     | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/frontend/src/app/pages/Dashboard/geometry/dashboardTethers.ts b/frontend/src/app/pages/Dashboard/geometry/dashboardTethers.ts
index 142c9a77..d168c5cf 100644
--- a/frontend/src/app/pages/Dashboard/geometry/dashboardTethers.ts
+++ b/frontend/src/app/pages/Dashboard/geometry/dashboardTethers.ts
@@ -243,8 +243,9 @@ export function useTethers({
 
       const midX = x1 + (x2 - x1) / 2;
       const midY = y1 + (y2 - y1) / 2;
-      const labelX = isVertical ? midX : midX + (x2 - midX) * 0.15;
-      const labelY = isVertical ? midY + (y2 - midY) * 0.15 : y2;
+      // Center the pill on the line midpoint: the box is left-anchored at labelX, so back off half its text width (same trick as the monitor "Watching" label).
+      const labelX = midX - (label.length * 7.5) / 2;
+      const labelY = midY;
 
       return {
         key,