Commit 8d0a693ca8a for woocommerce

commit 8d0a693ca8a416930a82943c47e14e5fdffa8aef
Author: Pavel Dohnal <pavel.dohnal@automattic.com>
Date:   Mon Oct 5 11:39:30 2026 +0200

    Add space above the background notice in the email editor (#69366)

    WordPress 7.1 moved the Color option into the Background panel and
    set row-gap: 0 on its inner wrapper. The compatibility notice has its
    margin reset to 0 and relied on that row gap, so it now touches the
    Color option.

    Give the notice its own top margin, scoped to the WP 7.1 wrapper
    class so WP 7.0, which still has the 16px row gap, is unchanged.

diff --git a/packages/js/email-editor/changelog/fix-STOMAIL-8566-background-notice-spacing b/packages/js/email-editor/changelog/fix-STOMAIL-8566-background-notice-spacing
new file mode 100644
index 00000000000..ff6dfabb59e
--- /dev/null
+++ b/packages/js/email-editor/changelog/fix-STOMAIL-8566-background-notice-spacing
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Add space between the Background panel’s color option and the email client compatibility warning.
diff --git a/packages/js/email-editor/src/components/sidebar/style.scss b/packages/js/email-editor/src/components/sidebar/style.scss
index 5207769f292..79293c57eb8 100644
--- a/packages/js/email-editor/src/components/sidebar/style.scss
+++ b/packages/js/email-editor/src/components/sidebar/style.scss
@@ -1,4 +1,5 @@
 @import "~@wordpress/base-styles/colors";
+@import "~@wordpress/base-styles/variables";

 .background-block-support-panel .woocommerce-grid-full-width,
 .border-block-support-panel .woocommerce-grid-full-width {
@@ -9,6 +10,13 @@
 	margin: 0;
 }

+// WP 7.1 sets row-gap: 0 on the Background panel wrapper, so the notice needs its own spacing.
+.background-block-support-panel
+	.background-block-support-panel__inner-wrapper
+	.woocommerce-grid-full-width {
+	margin-block-start: $grid-unit-20;
+}
+
 // Hide core’s quick-navigation “Content” panels (template and template part)
 // from the document tab only. They list the single block that fills the canvas
 // and core has no opt-out that keeps the body editable. The block icon class is