diff --git a/web/css/resolver-main.css b/web/css/resolver-main.css index aae03e7..b115d4f 100644 --- a/web/css/resolver-main.css +++ b/web/css/resolver-main.css @@ -728,6 +728,8 @@ } #model-resolver-modal .mr-missing-list-row { + content-visibility: auto; + contain-intrinsic-size: auto 64px; width: 100%; min-height: 64px; padding: 9px 12px 9px 8px; diff --git a/web/css/resolver-shell.css b/web/css/resolver-shell.css index ca5c279..902ab96 100644 --- a/web/css/resolver-shell.css +++ b/web/css/resolver-shell.css @@ -426,6 +426,8 @@ } .mr-queue-item { + content-visibility: auto; + contain-intrinsic-size: auto 54px; display: grid; gap: 4px; padding: 10px 0; diff --git a/web/resolver/actions/queue_methods.js b/web/resolver/actions/queue_methods.js index 079363f..b6dd56e 100644 --- a/web/resolver/actions/queue_methods.js +++ b/web/resolver/actions/queue_methods.js @@ -1947,11 +1947,18 @@ export const queueMethods = { } } if (this._splitPreviewCollapsed) return; - this.applyQueueSplitWidth(this._pendingSplitWidth, { - bounds, - containerWidth: this._splitStart.containerWidth, - skipIfUnchanged: true - }); + + if (!this._splitDragFrame) { + this._splitDragFrame = requestAnimationFrame(() => { + this._splitDragFrame = null; + if (!this._splitDragging || this._splitPreviewCollapsed) return; + this.applyQueueSplitWidth(this._pendingSplitWidth, { + bounds: this._splitStart?.bounds || bounds, + containerWidth: this._splitStart?.containerWidth, + skipIfUnchanged: true + }); + }); + } }, endSplitDrag(e = null) { diff --git a/web/resolver/views/missing_browser_methods.js b/web/resolver/views/missing_browser_methods.js index 73edb46..1c8cf8e 100644 --- a/web/resolver/views/missing_browser_methods.js +++ b/web/resolver/views/missing_browser_methods.js @@ -1023,13 +1023,20 @@ export const missingBrowserMethods = { if (this._pendingMissingBrowserSplitWidth === this._appliedMissingBrowserSplitWidth) return; if (!this._missingBrowserSplitDetailPane) return; this.activateMissingBrowserSplitUi(); - this.applyMissingBrowserDetailWidth(this._missingBrowserSplitDetailPane, this._pendingMissingBrowserSplitWidth, { - browserWidth: this._missingBrowserSplitStart.browserWidth, - availableWidth: this._missingBrowserSplitStart.availableWidth, - splitBounds: this._missingBrowserSplitStart.bounds, - skipIfUnchanged: true - }); - this._appliedMissingBrowserSplitWidth = this._pendingMissingBrowserSplitWidth; + + if (!this._missingBrowserSplitFrame) { + this._missingBrowserSplitFrame = requestAnimationFrame(() => { + this._missingBrowserSplitFrame = null; + if (!this._missingBrowserSplitDragging || !this._missingBrowserSplitDetailPane) return; + this.applyMissingBrowserDetailWidth(this._missingBrowserSplitDetailPane, this._pendingMissingBrowserSplitWidth, { + browserWidth: this._missingBrowserSplitStart?.browserWidth, + availableWidth: this._missingBrowserSplitStart?.availableWidth, + splitBounds: this._missingBrowserSplitStart?.bounds, + skipIfUnchanged: true + }); + this._appliedMissingBrowserSplitWidth = this._pendingMissingBrowserSplitWidth; + }); + } }, endMissingBrowserSplitDrag(event = null) {