diff --git a/ts/editor/HandleLabel.svelte b/ts/editor/HandleLabel.svelte index 66ebdc3ff..9de14e0db 100644 --- a/ts/editor/HandleLabel.svelte +++ b/ts/editor/HandleLabel.svelte @@ -10,14 +10,20 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html let dimensions: HTMLDivElement; let overflowFix = 0; - afterUpdate(() => { + function updateOverflow(dimensions: HTMLDivElement) { const boundingClientRect = dimensions.getBoundingClientRect(); const overflow = isRtl ? window.innerWidth - boundingClientRect.x - boundingClientRect.width : boundingClientRect.x; overflowFix = Math.min(0, overflowFix + overflow, overflow); - }); + } + + function updateOverflowAsync(dimensions: HTMLDivElement) { + setTimeout(() => updateOverflow(dimensions)); + } + + afterUpdate(() => updateOverflow(dimensions)); const dispatch = createEventDispatcher(); @@ -29,6 +35,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html class="image-handle-dimensions" class:is-rtl={isRtl} style="--overflow-fix: {overflowFix}px" + use:updateOverflowAsync > diff --git a/ts/editor/fields.scss b/ts/editor/fields.scss index 2d8a9d395..f220b915e 100644 --- a/ts/editor/fields.scss +++ b/ts/editor/fields.scss @@ -10,6 +10,7 @@ #fields { display: flex; + overflow-x: hidden; flex-direction: column; margin: 5px; }