From 9a3ad4009694b023320b5b8b6796a85432031edb Mon Sep 17 00:00:00 2001 From: Bree Hall Date: Thu, 3 Nov 2022 16:06:13 -0400 Subject: [PATCH 1/5] Remove overflow: hidden from EuiModal styles that caused a red overlay on the modals to appear when longer content is added to the modal This logic was added to assist with a bug in IE, and now that IE is out of service, this should be safe to remove --- src/components/modal/_modal.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/modal/_modal.scss b/src/components/modal/_modal.scss index de5f134a058..f1ce5fe80c8 100644 --- a/src/components/modal/_modal.scss +++ b/src/components/modal/_modal.scss @@ -5,7 +5,6 @@ display: flex; flex-direction: column; max-height: 75vh; // We overflow the modal body based off this - overflow: hidden; // Ensure long, non-breaking text doesn't expand beyond the modal bounds position: relative; background-color: $euiColorEmptyShade; From d4c455a676427566363fdea8b4a17ffa14a5df77 Mon Sep 17 00:00:00 2001 From: Bree Hall Date: Thu, 3 Nov 2022 16:56:16 -0400 Subject: [PATCH 2/5] CHANGELOG --- upcoming_changelogs/6343.md | 3 +++ 1 file changed, 3 insertions(+) create mode 100644 upcoming_changelogs/6343.md diff --git a/upcoming_changelogs/6343.md b/upcoming_changelogs/6343.md new file mode 100644 index 00000000000..4132a2a9850 --- /dev/null +++ b/upcoming_changelogs/6343.md @@ -0,0 +1,3 @@ +**Bug fixes** + +- Fixed `EuiModal` to not show a red rectangle that blocks content when the modal's content is long enough to scroll \ No newline at end of file From 4d521d5d001d5348d4d612859f7eec631881d80f Mon Sep 17 00:00:00 2001 From: Bree Hall <40739624+breehall@users.noreply.github.com> Date: Thu, 3 Nov 2022 17:15:49 -0400 Subject: [PATCH 3/5] Update upcoming_changelogs/6343.md Co-authored-by: Constance --- upcoming_changelogs/6343.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/upcoming_changelogs/6343.md b/upcoming_changelogs/6343.md index 4132a2a9850..e8645439fb9 100644 --- a/upcoming_changelogs/6343.md +++ b/upcoming_changelogs/6343.md @@ -1,3 +1,3 @@ **Bug fixes** -- Fixed `EuiModal` to not show a red rectangle that blocks content when the modal's content is long enough to scroll \ No newline at end of file +- Fixed a webkit rendering issue with `EuiModal`s containing tables tall enough to scroll \ No newline at end of file From e1efb1638d46cc1ab0e051be4ba74732b6919f97 Mon Sep 17 00:00:00 2001 From: Bree Hall <40739624+breehall@users.noreply.github.com> Date: Thu, 3 Nov 2022 17:49:44 -0400 Subject: [PATCH 4/5] Update upcoming_changelogs/6343.md Co-authored-by: Constance --- upcoming_changelogs/6343.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/upcoming_changelogs/6343.md b/upcoming_changelogs/6343.md index e8645439fb9..ab85d43f30f 100644 --- a/upcoming_changelogs/6343.md +++ b/upcoming_changelogs/6343.md @@ -1,3 +1,3 @@ **Bug fixes** -- Fixed a webkit rendering issue with `EuiModal`s containing tables tall enough to scroll \ No newline at end of file +- Fixed a webkit rendering issue with `EuiModal`s containing `EuiBasicTable`s tall enough to scroll \ No newline at end of file From 4097c5aa3fa4523767ec7df1cb3379fadc1d77ca Mon Sep 17 00:00:00 2001 From: Bree Hall Date: Thu, 3 Nov 2022 18:09:54 -0400 Subject: [PATCH 5/5] Restore overflow:hidden in the form of a comment to reconsider once the Chromium bug that is causing the red squares to appear is resolved. --- src/components/modal/_modal.scss | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/components/modal/_modal.scss b/src/components/modal/_modal.scss index f1ce5fe80c8..60380ea4543 100644 --- a/src/components/modal/_modal.scss +++ b/src/components/modal/_modal.scss @@ -6,6 +6,9 @@ flex-direction: column; max-height: 75vh; // We overflow the modal body based off this + // TODO: Consider restoring this once https://bugs.chromium.org/p/chromium/issues/detail?id=1229700 is resolved + // overflow: hidden; Ensure long, non-breaking text doesn't expand beyond the modal bounds + position: relative; background-color: $euiColorEmptyShade; border-radius: $euiBorderRadius;