Site Editor: Animate the radius of the frame (#60415)

Co-authored-by: youknowriad <[email protected]> Co-authored-by: jameskoster <[email protected]>
WordPress · Apr 3, 2024 · acf21a7 · acf21a7
1 parent 99597b1
commit acf21a7
Showing 1 changed file with 4 additions and 7 deletions.
diff --git a/packages/edit-site/src/components/layout/style.scss b/packages/edit-site/src/components/layout/style.scss
@@ -131,16 +131,13 @@
 		top: $canvas-padding;
 		bottom: $canvas-padding;
 		width: calc(100% - #{$canvas-padding});
+		transition: border-radius 0.4s;
+		// This ensure the radius work properly.
+		overflow: hidden;
 
-		& > div {
+		.edit-site-layout:not(.is-full-canvas) & {
 			border-radius: $radius-block-ui * 4;
-			// Not sure why this is necessary.
-			.edit-site-layout:not(.is-full-canvas) & .edit-site-visual-editor__editor-canvas,
-			.edit-site-layout:not(.is-full-canvas) & .interface-interface-skeleton__content {
-				border-radius: $radius-block-ui * 4;
-			}
 		}
-
 	}
 
 	.edit-site-layout.is-full-canvas & {