From 6d7bf7041ada2f5f264b2cbbeebfac32ea0992de Mon Sep 17 00:00:00 2001
From: balibabu <cike8899@users.noreply.github.com>
Date: Mon, 14 Sep 2026 19:32:36 +0800
Subject: [PATCH] Feat: Shorten the default distance of the timeline connector
 lines. (#19612)

---
 web/src/components/structure-graph/adapters.tsx        |  2 +-
 .../timeline-x6-graph/hooks/use-x6-graph.ts            | 10 +++++++---
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/web/src/components/structure-graph/adapters.tsx b/web/src/components/structure-graph/adapters.tsx
index 1f194942a2..c285a00caa 100644
--- a/web/src/components/structure-graph/adapters.tsx
+++ b/web/src/components/structure-graph/adapters.tsx
@@ -326,7 +326,7 @@ export function adaptTimelineToX6Data(template: IStructureGraphTemplate): {
           fill: isTimestamp
             ? 'rgb(var(--accent-primary))'
             : 'rgb(var(--text-primary))',
-          fontSize: 12,
+          fontSize: 24,
           ...(isTimestamp && {
             refX: '50%',
             refY: 0,
diff --git a/web/src/components/structure-graph/timeline-x6-graph/hooks/use-x6-graph.ts b/web/src/components/structure-graph/timeline-x6-graph/hooks/use-x6-graph.ts
index 181ca7e64a..061382ebda 100644
--- a/web/src/components/structure-graph/timeline-x6-graph/hooks/use-x6-graph.ts
+++ b/web/src/components/structure-graph/timeline-x6-graph/hooks/use-x6-graph.ts
@@ -71,9 +71,13 @@ export function useX6Graph(
     const dagreLayout = new DagreLayout({
       type: 'dagre',
       rankdir: 'LR',
-      ranksep: 240,
-      nodesep: 200,
-      edgeMinLen: 2,
+      // DagreLayout does not read each node's own width/height; without
+      // nodeSize it treats every node as 0x0, so ranksep/nodesep end up
+      // being node-center distances and nodes overlap their edges.
+      nodeSize: (node) => [node.width, node.height],
+      // With real node sizes these are border-to-border gaps.
+      ranksep: 80,
+      nodesep: 120,
       controlPoints: false,
     });