Try: Contextual frame bg color to avoid artifacting. (#62223)

* Try: Contextual frame bg color to avoid artifacting. * Try different fix. Co-authored-by: jasmussen <[email protected]> Co-authored-by: MaggieCabrera <[email protected]> Co-authored-by: youknowriad <[email protected]>
WordPress · Jun 11, 2024 · 952532e · 952532e
1 parent 1941487
commit 952532e
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/packages/block-editor/src/components/block-canvas/style.scss b/packages/block-editor/src/components/block-canvas/style.scss
@@ -1,7 +1,7 @@
 iframe[name="editor-canvas"] {
+	box-sizing: border-box;
 	width: 100%;
 	height: 100%;
 	display: block;
-	background-color: $gray-300;
-	box-sizing: border-box;
+	background-color: transparent;
 }
diff --git a/packages/edit-site/src/components/layout/style.scss b/packages/edit-site/src/components/layout/style.scss
@@ -4,6 +4,11 @@
 	color: $gray-400;
 	display: flex;
 	flex-direction: column;
+
+	// Show a dark background in "frame" mode to avoid edge artifacts.
+	&:not(.is-full-canvas) .editor-visual-editor {
+		background: $gray-900;
+	}
 }
 
 .edit-site-layout__hub {