From 7b861fe0231a1821714666663e0cd211dcf7ddaf Mon Sep 17 00:00:00 2001 From: bipedal-eel Date: Mon, 12 May 2025 14:04:37 +0200 Subject: [PATCH 1/2] scroller overflow-y: scroll -> auto; content overflow-y: clip --- dialog/internal/_dialog.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/dialog/internal/_dialog.scss b/dialog/internal/_dialog.scss index a166cbfd26..4c5f6a0713 100644 --- a/dialog/internal/_dialog.scss +++ b/dialog/internal/_dialog.scss @@ -173,7 +173,7 @@ // space from appearing on platforms that reserve scrollbar space. // Note: we only scroll vertically. Horizontal scrolling should be handled // by the content. - overflow-y: scroll; + overflow-y: auto; } .content { @@ -185,6 +185,7 @@ font-weight: map.get($tokens, 'supporting-text-weight'); height: min-content; // Needed for Safari position: relative; + overflow-y: clip; // Needed for .scrollable .scroller } slot[name='content']::slotted(*) { From 5b75bebffb3f16a00b7ba9c284a1b8a16b4a11cc Mon Sep 17 00:00:00 2001 From: bipedal-eel Date: Tue, 13 May 2025 08:35:59 +0200 Subject: [PATCH 2/2] .scroller false while opening --- dialog/internal/_dialog.scss | 3 +-- dialog/internal/dialog.ts | 2 +- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/dialog/internal/_dialog.scss b/dialog/internal/_dialog.scss index 4c5f6a0713..a166cbfd26 100644 --- a/dialog/internal/_dialog.scss +++ b/dialog/internal/_dialog.scss @@ -173,7 +173,7 @@ // space from appearing on platforms that reserve scrollbar space. // Note: we only scroll vertically. Horizontal scrolling should be handled // by the content. - overflow-y: auto; + overflow-y: scroll; } .content { @@ -185,7 +185,6 @@ font-weight: map.get($tokens, 'supporting-text-weight'); height: min-content; // Needed for Safari position: relative; - overflow-y: clip; // Needed for .scrollable .scroller } slot[name='content']::slotted(*) { diff --git a/dialog/internal/dialog.ts b/dialog/internal/dialog.ts index 83b261f5b6..ea80acb09a 100644 --- a/dialog/internal/dialog.ts +++ b/dialog/internal/dialog.ts @@ -266,7 +266,7 @@ export class Dialog extends dialogBaseClass { protected override render() { const scrollable = - this.open && !(this.isAtScrollTop && this.isAtScrollBottom); + !this.isOpening && this.open && !(this.isAtScrollTop && this.isAtScrollBottom); const classes = { 'has-headline': this.hasHeadline, 'has-actions': this.hasActions,