diff --git a/frontend/src/app/globals.css b/frontend/src/app/globals.css index bef58a58..5aef5d87 100644 --- a/frontend/src/app/globals.css +++ b/frontend/src/app/globals.css @@ -5264,6 +5264,16 @@ input:not([type="radio"]):not([type="checkbox"]):not([class^="ant-"]):not([class width: max-content; } .chart-symbol-bubble.is-below { transform: translate(-50%, 8px); } +/* Waiting copy sits over the breathing empty chart, centred, so the waiting + stage and the finished one are the same height. */ +.chart-page-waiting-plot { position: relative; } +.chart-page-note.chart-page-skeleton-copy { + position: absolute; + inset: 50% var(--space-4) auto; + margin: 0; + transform: translateY(-50%); + text-align: center; +} .chart-page-symbol-hit { fill: transparent; stroke: none; } .chart-page-symbol-target { cursor: help; } .chart-page-symbol-target:focus-visible { diff --git a/frontend/src/components/chart-page/chart-page-skeleton.tsx b/frontend/src/components/chart-page/chart-page-skeleton.tsx index cc8b2950..6eeafc5a 100644 --- a/frontend/src/components/chart-page/chart-page-skeleton.tsx +++ b/frontend/src/components/chart-page/chart-page-skeleton.tsx @@ -10,7 +10,9 @@ export function ChartPageSkeleton({ copy, western = false }: { copy: string; wes {western ? : } -

{copy}

+ {/* Over the empty drawing, not under it: the finished chart has no line + below it any more (BUG-1101), so a line here would make it jump. */} +

{copy}

);