diff --git a/frontend/src/Graph.svelte b/frontend/src/Graph.svelte index 99764d0..1dba65f 100644 --- a/frontend/src/Graph.svelte +++ b/frontend/src/Graph.svelte @@ -202,13 +202,11 @@ let tooltipCurrPoints: number | null = null; $: tooltipTextPos = hoveredTask != null ? [(hoveredTask.position ?? [0,0])[0], (hoveredTask.position ?? [0,0])[1] + 40] : [0,0]; let tooltipBoxWidth = 0; - let tooltipBoxHeight = 0; async function resizeTooltipBox() { await tick(); if (tooltipTextElement == null) return; const bbox = tooltipTextElement.getBBox() tooltipBoxWidth = bbox.width + 10 + 10; - tooltipBoxHeight = bbox.height + 5 + 5; } $: { tooltipMaxPoints = null; @@ -338,15 +336,16 @@ x={tooltipTextPos[0]} y={tooltipTextPos[1] - 15} width={tooltipBoxWidth} - height={tooltipBoxHeight} + height={30} rx="3"> </rect> <text bind:this={tooltipTextElement} x={tooltipTextPos[0] + tooltipBoxWidth / 2} - y={tooltipTextPos[1] + 4} + y={tooltipTextPos[1]} text-anchor="middle" - alignment-baseline="middle"> + alignment-baseline="middle" + dominant-baseline="middle"> {hoveredTask.type == 'open-data' ? hoveredTask.taskReference : "text"} | {tooltipCurrPoints ?? '?'} bod{ "ů yyy"[tooltipCurrPoints ?? 0] ?? "ů" } z {tooltipMaxPoints ?? '?'} </text> </g> diff --git a/frontend/src/GraphNode.svelte b/frontend/src/GraphNode.svelte index 62056be..9f4a9e2 100644 --- a/frontend/src/GraphNode.svelte +++ b/frontend/src/GraphNode.svelte @@ -112,9 +112,10 @@ <text bind:this={text_element} x={cx} - y={cy + 5} + y={cy} text-anchor="middle" alignment-baseline="middle" + dominant-baseline="middle" transform="translate({cx}, {cy}) rotate({task.rotationAngle ?? 0}) translate({-cx}, {-cy})"> {task.title == null ? task.id : task.title} </text> @@ -133,8 +134,9 @@ <text bind:this={text_element} x={cx} - y={cy + 5} + y={cy} text-anchor="middle" + dominant-baseline="middle" alignment-baseline="middle"> {task.title == null ? task.id : task.title} </text>