diff --git a/modules/rwallet/lib/wallet-viz.ts b/modules/rwallet/lib/wallet-viz.ts
index db0d82f..8983e15 100644
--- a/modules/rwallet/lib/wallet-viz.ts
+++ b/modules/rwallet/lib/wallet-viz.ts
@@ -250,6 +250,7 @@ export function renderTimeline(
// Diagonal waterfall flows
const flowHeight = 80;
const xOffset = flowHeight * 0.7;
+ const cornerR = Math.min(flowHeight * 0.25, xOffset * 0.4);
let prevBalance = 0;
data.forEach(tx => {
@@ -275,10 +276,17 @@ export function renderTimeline(
const endX = x;
const path = d3.path();
+ // Left edge: vertical down, rounded corner, horizontal right to river
path.moveTo(startX - farEndHalf, startY);
- path.bezierCurveTo(startX - farEndHalf, startY + flowHeight * 0.55, endX - riverEndHalf, endY - flowHeight * 0.45, endX - riverEndHalf, endY);
+ path.lineTo(startX - farEndHalf, endY - cornerR);
+ path.quadraticCurveTo(startX - farEndHalf, endY, startX - farEndHalf + cornerR, endY);
+ path.lineTo(endX - riverEndHalf, endY);
+ // Across river end
path.lineTo(endX + riverEndHalf, endY);
- path.bezierCurveTo(endX + riverEndHalf, endY - flowHeight * 0.45, startX + farEndHalf, startY + flowHeight * 0.55, startX + farEndHalf, startY);
+ // Right edge: horizontal left, rounded corner, vertical up
+ path.lineTo(startX + farEndHalf + cornerR, endY);
+ path.quadraticCurveTo(startX + farEndHalf, endY, startX + farEndHalf, endY - cornerR);
+ path.lineTo(startX + farEndHalf, startY);
path.closePath();
contentGroup.append("path").attr("d", path.toString()).attr("fill", `url(#${id}-inflow)`)
@@ -293,10 +301,17 @@ export function renderTimeline(
const endX = x + xOffset;
const path = d3.path();
+ // Left edge: horizontal right from river, rounded corner, vertical down
path.moveTo(startX - riverEndHalf, startY);
- path.bezierCurveTo(startX - riverEndHalf, startY + flowHeight * 0.45, endX - farEndHalf, endY - flowHeight * 0.55, endX - farEndHalf, endY);
+ path.lineTo(endX - farEndHalf - cornerR, startY);
+ path.quadraticCurveTo(endX - farEndHalf, startY, endX - farEndHalf, startY + cornerR);
+ path.lineTo(endX - farEndHalf, endY);
+ // Across far end
path.lineTo(endX + farEndHalf, endY);
- path.bezierCurveTo(endX + farEndHalf, endY - flowHeight * 0.55, startX + riverEndHalf, startY + flowHeight * 0.45, startX + riverEndHalf, startY);
+ // Right edge: vertical up, rounded corner, horizontal left to river
+ path.lineTo(endX + farEndHalf, startY + cornerR);
+ path.quadraticCurveTo(endX + farEndHalf, startY, endX + farEndHalf - cornerR, startY);
+ path.lineTo(startX + riverEndHalf, startY);
path.closePath();
contentGroup.append("path").attr("d", path.toString()).attr("fill", `url(#${id}-outflow)`)
diff --git a/modules/rwallet/mod.ts b/modules/rwallet/mod.ts
index 20da9d4..c01987e 100644
--- a/modules/rwallet/mod.ts
+++ b/modules/rwallet/mod.ts
@@ -1239,7 +1239,7 @@ function renderWallet(spaceSlug: string, initialView?: string) {
modules: getModuleInfoList(),
theme: "dark",
body: ``,
- scripts: ``,
+ scripts: ``,
styles: ``,
});
}