From 948b0207ed77a51d60fc3f9d8cd0d6318ebbc40d Mon Sep 17 00:00:00 2001 From: Miguel Gasca Date: Mon, 28 Jul 2025 17:36:46 +0200 Subject: [PATCH 1/3] WIP --- client/style.scss | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) diff --git a/client/style.scss b/client/style.scss index ccbcc9ce04f..d2a515c0b72 100644 --- a/client/style.scss +++ b/client/style.scss @@ -171,3 +171,24 @@ img { } } } + +/** + * Fix for linear gradient overlay that doesn't disappear on resize. + * The issue is that the `is-scrollable-right` class is not being removed + * when the viewport is resized back to a larger size. + */ +.woocommerce-payments-page { + // Force hide the gradient overlay on larger viewports where tables shouldn't be scrollable + @media screen and ( min-width: 960px ) { + .woocommerce-table__table.is-scrollable-right::after { + opacity: 0 !important; + } + } + + // Additional breakpoint for very large screens + @media screen and ( min-width: 1200px ) { + .woocommerce-table__table.is-scrollable-right::after { + opacity: 0 !important; + } + } +} From 223315fcaf2ec9a35d8be0928f7cc63efdd01b1a Mon Sep 17 00:00:00 2001 From: Miguel Gasca Date: Mon, 28 Jul 2025 18:05:33 +0200 Subject: [PATCH 2/3] Remove !important from the CSS declarations --- client/style.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/client/style.scss b/client/style.scss index d2a515c0b72..29a4134f973 100644 --- a/client/style.scss +++ b/client/style.scss @@ -181,14 +181,14 @@ img { // Force hide the gradient overlay on larger viewports where tables shouldn't be scrollable @media screen and ( min-width: 960px ) { .woocommerce-table__table.is-scrollable-right::after { - opacity: 0 !important; + opacity: 0; } } // Additional breakpoint for very large screens @media screen and ( min-width: 1200px ) { .woocommerce-table__table.is-scrollable-right::after { - opacity: 0 !important; + opacity: 0; } } } From 0b99eeb0d682ef05699431064eae944d666ff1fd Mon Sep 17 00:00:00 2001 From: Miguel Gasca Date: Tue, 29 Jul 2025 10:43:23 +0200 Subject: [PATCH 3/3] Add changelog --- ...-5217-linear-gradient-overlay-does-not-disappear-on-resize | 4 ++++ 1 file changed, 4 insertions(+) create mode 100644 changelog/fix-woopmnt-5217-linear-gradient-overlay-does-not-disappear-on-resize diff --git a/changelog/fix-woopmnt-5217-linear-gradient-overlay-does-not-disappear-on-resize b/changelog/fix-woopmnt-5217-linear-gradient-overlay-does-not-disappear-on-resize new file mode 100644 index 00000000000..c71a673e408 --- /dev/null +++ b/changelog/fix-woopmnt-5217-linear-gradient-overlay-does-not-disappear-on-resize @@ -0,0 +1,4 @@ +Significance: patch +Type: fix + +Fix: Linear gradient overlay on tables does not disappear on resize