From 55a50bba3c15a7b2fc710cc4ec8a38d84f21d7fd Mon Sep 17 00:00:00 2001 From: skjnldsv Date: Wed, 9 Sep 2026 17:58:57 +0200 Subject: [PATCH] fix(dialog): let the dialog scroll instead of the form inside it The form was its own scroll container, so its scrollbar sat inside the dialog's padding and floated over the content. NcDialog already scrolls its content, so the form no longer does, and the header is sticky to stay in place while it scrolls. Assisted-by: ClaudeCode:claude-opus-4-8 Signed-off-by: skjnldsv --- lib/dialog/SharingDialog.vue | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/lib/dialog/SharingDialog.vue b/lib/dialog/SharingDialog.vue index b2b9076..096c363 100644 --- a/lib/dialog/SharingDialog.vue +++ b/lib/dialog/SharingDialog.vue @@ -207,15 +207,12 @@ onMounted(async () => { gap: calc(var(--default-grid-baseline) * 3); } - // Scroll the form (everything but the fixed header/close) once it grows - // tall, so the scrollbar never overlaps the header. A max-height rather than - // flex is used so the dialog still sizes to its content when it is short. + // The dialog scrolls its own content, so the scrollbar sits at its edge + // rather than inside the form. The header stays put while it does. :deep(.share-panel) { - max-height: 50vh; // Keep a stable floor so the dialog does not jump around as the content // changes (switching tabs, adding recipients, revealing toggles). min-height: min(320px, 50vh); - overflow-y: auto; } &__loading, @@ -249,6 +246,12 @@ onMounted(async () => { } } .sharing-dialog__header { + // The dialog scrolls behind it, so keep the title and the back button in + // place instead of letting them scroll away. + position: sticky; + top: 0; + z-index: 3; + background-color: var(--color-main-background); display: flex; align-items: center; gap: calc(var(--default-grid-baseline) * 2);