From c34cda4380b12c7d596f9c982736bfd5af0deb56 Mon Sep 17 00:00:00 2001
From: Aaron Robertshaw <60436221+aaronrobertshaw@users.noreply.github.com>
Date: Fri, 30 Apr 2021 18:05:48 +1000
Subject: [PATCH] Add border support to the cover block

---
 packages/block-library/src/cover/block.json | 1 +
 packages/block-library/src/cover/style.scss | 8 +++++++-
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/block-library/src/cover/block.json b/packages/block-library/src/cover/block.json
index 676fb581c2b958..58e1b94dda7e5f 100644
--- a/packages/block-library/src/cover/block.json
+++ b/packages/block-library/src/cover/block.json
@@ -57,6 +57,7 @@
 		"spacing": {
 			"padding": true
 		},
+		"__experimentalBorder": true,
 		"color": {
 			"__experimentalDuotone": "> .wp-block-cover__image-background, > .wp-block-cover__video-background",
 			"text": false,
diff --git a/packages/block-library/src/cover/style.scss b/packages/block-library/src/cover/style.scss
index 05d5fe58a76558..15e22ec56562f1 100644
--- a/packages/block-library/src/cover/style.scss
+++ b/packages/block-library/src/cover/style.scss
@@ -11,6 +11,8 @@
 	padding: 1em;
 	// This block has customizable padding, border-box makes that more predictable.
 	box-sizing: border-box;
+	// Overflow is hidden to handle border radius being applied on the block wrapper.
+	overflow: hidden;
 
 	&.has-parallax {
 		background-attachment: fixed;
@@ -39,11 +41,15 @@
 	 * background-color class implies that another style will provide the background color
 	 * for the overlay.
 	 *
+	 * The default background color has been moved to the before pseudo element
+	 * to allow custom border styles. If left on the `.has-background-dim`
+	 * element the color acts as a background to the dotted/dashed borders.
+	 *
 	 * See:
 	 *   - Issue with background color specificity: https://github.com/WordPress/gutenberg/issues/26545
 	 *   - Issue with alternative fix: https://github.com/WordPress/gutenberg/issues/26545
 	 */
-	&.has-background-dim:not([class*="-background-color"]) {
+	&.has-background-dim:not([class*="-background-color"])::before {
 		background-color: $black;
 	}