Update <Placeholder hasIllustration> design, remove unnecessary mixin

WordPress · Jul 24, 2024 · 1453f90 · 1453f90
1 parent bdc0acb
commit 1453f90
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 21 deletions.
diff --git a/packages/base-styles/_mixins.scss b/packages/base-styles/_mixins.scss
@@ -162,22 +162,6 @@
 	}
 }
 
-@mixin placeholder-style() {
-	border-radius: $radius-block-ui;
-
-	&::before {
-		content: "";
-		position: absolute;
-		top: 0;
-		right: 0;
-		bottom: 0;
-		left: 0;
-		pointer-events: none;
-		background: currentColor;
-		opacity: 0.1;
-	}
-}
-
 /**
  * Allows users to opt-out of animations via OS-level preferences.
  */

diff --git a/packages/block-editor/src/components/button-block-appender/content.scss b/packages/block-editor/src/components/button-block-appender/content.scss
@@ -52,7 +52,7 @@
 			left: 0;
 			pointer-events: none;
 			border: $border-width dashed currentColor;
-			@include placeholder-style();
+			border-radius: $radius-block-ui;
 		}
 
 		.block-editor-inserter {

diff --git a/packages/block-library/src/group/editor.scss b/packages/block-library/src/group/editor.scss
@@ -43,7 +43,7 @@
 		pointer-events: none;
 		min-height: $grid-unit-60 - $border-width - $border-width;
 		border: $border-width dashed currentColor;
-		@include placeholder-style();
+		border-radius: $radius-block-ui;
 	}
 
 	// Let the parent be selectable in the placeholder area.

diff --git a/packages/block-library/src/navigation/editor.scss b/packages/block-library/src/navigation/editor.scss
@@ -287,7 +287,6 @@ $color-control-label-height: 20px;
 		left: 0;
 		pointer-events: none;
 		border: $border-width dashed currentColor;
-		@include placeholder-style();
 
 		// Inherit border radius from style variations.
 		border-radius: inherit;

diff --git a/packages/components/src/placeholder/style.scss b/packages/components/src/placeholder/style.scss
@@ -183,8 +183,17 @@
 		}
 	}
 
-	// By painting the borders here, we enable them to be replaced by the Border control.
-	@include placeholder-style();
+	&::before {
+		content: "";
+		position: absolute;
+		top: 0;
+		right: 0;
+		bottom: 0;
+		left: 0;
+		pointer-events: none;
+		background: $gray-900;
+		opacity: 0.7;
+	}
 
 	overflow: hidden;
 	.is-selected & {