Merge pull request #1300 from Automattic/fix/issue-1274

Varia: Update Cover Block default background-color and text color

brompton/sass/_config-child-theme-deep.scss

@@ -188,7 +188,11 @@ $config-button: (
  * Cover
  */
 $config-cover: (
-	"height": calc( 18 * #{map-deep-get($config-global, "spacing", "vertical")} ),
+	"height": #{18 * map-deep-get($config-global, "spacing", "vertical")},
+	"color": (
+		"foreground": #{map-deep-get($config-global, "color", "background", "default")},
+		"background": #{map-deep-get($config-global, "color", "foreground", "default")},
+	)
 );
 
 /**

coutoire/sass/_config-child-theme-deep.scss

@@ -188,7 +188,11 @@ $config-button: (
  * Cover
  */
 $config-cover: (
-	"height": calc( 15 * #{map-deep-get($config-global, "spacing", "vertical")} ),
+	"height": #{15 * map-deep-get($config-global, "spacing", "vertical")},
+	"color": (
+		"foreground": #{map-deep-get($config-global, "color", "background", "default")},
+		"background": #{map-deep-get($config-global, "color", "foreground", "default")},
+	)
 );
 
 /**

exford/sass/_config-child-theme-deep.scss

@@ -189,6 +189,10 @@ $config-button: (
  */
 $config-cover: (
 	"height": #{15 * map-deep-get($config-global, "spacing", "vertical")},
+	"color": (
+		"foreground": #{map-deep-get($config-global, "color", "background", "default")},
+		"background": #{map-deep-get($config-global, "color", "foreground", "default")},
+	)
 );
 
 /**

hever/sass/_config-child-theme-deep.scss

@@ -188,7 +188,11 @@ $config-button: (
  * Cover
  */
 $config-cover: (
-	"height": calc( 15 * #{map-deep-get($config-global, "spacing", "vertical")} ),
+	"height": #{15 * map-deep-get($config-global, "spacing", "vertical")},
+	"color": (
+		"foreground": #{map-deep-get($config-global, "color", "background", "default")},
+		"background": #{map-deep-get($config-global, "color", "foreground", "default")},
+	)
 );
 
 /**

leven/sass/_config-child-theme-deep.scss

@@ -188,7 +188,11 @@ $config-button: (
  * Cover
  */
 $config-cover: (
-	"height": calc( 15 * #{map-deep-get($config-global, "spacing", "vertical")} ),
+	"height": #{15 * map-deep-get($config-global, "spacing", "vertical")},
+	"color": (
+		"foreground": #{map-deep-get($config-global, "color", "background", "default")},
+		"background": #{map-deep-get($config-global, "color", "foreground", "default")},
+	)
 );
 
 /**

morden/sass/_config-child-theme-deep.scss

@@ -188,7 +188,11 @@ $config-button: (
  * Cover
  */
 $config-cover: (
-	"height": calc( 15 * #{map-deep-get($config-global, "spacing", "vertical")} ),
+	"height": #{15 * map-deep-get($config-global, "spacing", "vertical")},
+	"color": (
+		"foreground": #{map-deep-get($config-global, "color", "background", "default")},
+		"background": #{map-deep-get($config-global, "color", "foreground", "default")},
+	)
 );
 
 /**

redhill/sass/_config-child-theme-deep.scss

@@ -188,7 +188,11 @@ $config-button: (
  * Cover
  */
 $config-cover: (
-	"height": calc( 18 * #{map-deep-get($config-global, "spacing", "vertical")} ),
+	"height": #{18 * map-deep-get($config-global, "spacing", "vertical")},
+	"color": (
+		"foreground": #{map-deep-get($config-global, "color", "background", "default")},
+		"background": #{map-deep-get($config-global, "color", "foreground", "default")},
+	)
 );
 
 /**

rockfield/sass/_config-child-theme-deep.scss

@@ -189,6 +189,10 @@ $config-button: (
  */
 $config-cover: (
 	"height": 90vh,
+	"color": (
+		"foreground": #{map-deep-get($config-global, "color", "background", "default")},
+		"background": #{map-deep-get($config-global, "color", "foreground", "default")},
+	)
 );
 
 /**

stow/sass/_config-child-theme-deep.scss

@@ -188,7 +188,11 @@ $config-button: (
  * Cover
  */
 $config-cover: (
-	"height": calc( 15 * #{map-deep-get($config-global, "spacing", "vertical")} ),
+	"height": #{15 * map-deep-get($config-global, "spacing", "vertical")},
+	"color": (
+		"foreground": #{map-deep-get($config-global, "color", "background", "default")},
+		"background": #{map-deep-get($config-global, "color", "foreground", "default")},
+	)
 );
 
 /**

stratford/sass/_config-child-theme-deep.scss

@@ -188,7 +188,11 @@ $config-button: (
  * Cover
  */
 $config-cover: (
-	"height": calc( 15 * #{map-deep-get($config-global, "spacing", "vertical")} ),
+	"height": #{15 * map-deep-get($config-global, "spacing", "vertical")},
+	"color": (
+		"foreground": #{map-deep-get($config-global, "color", "background", "default")},
+		"background": #{map-deep-get($config-global, "color", "foreground", "default")},
+	)
 );
 
 /**

varia/sass/blocks/cover/_config.scss

@@ -2,6 +2,10 @@
  * Cover
  */
 $config-cover: (
-	"height": calc( 15 * #{map-deep-get($config-global, "spacing", "vertical")} ),
+	"height": #{15 * map-deep-get($config-global, "spacing", "vertical")},
+	"color": (
+		"foreground": #{map-deep-get($config-global, "color", "white")},
+		"background": #{map-deep-get($config-global, "color", "black")},
+	)
 );
 

varia/sass/blocks/cover/_editor.scss

@@ -1,13 +1,15 @@
 .wp-block-cover,
 .wp-block-cover-image {
 
-	background-color: #{map-deep-get($config-global, "color", "foreground", "default")};
+	background-color: #{map-deep-get($config-cover, "color", "background")};
+	color: #{map-deep-get($config-cover, "color", "foreground")};
 	min-height: #{map-deep-get($config-cover, "height")};
 
 	.wp-block-cover__inner-container,
 	.wp-block-cover-image-text,
-	.wp-block-cover-text {
-		color: #{map-deep-get($config-global, "color", "background", "default")};
+	.wp-block-cover-text,
+	.block-editor-block-list__block {
+		color: #{map-deep-get($config-cover, "color", "foreground")};
 
 		a {
 			color: currentColor;

varia/sass/blocks/cover/_style.scss

@@ -1,14 +1,14 @@
 .wp-block-cover,
 .wp-block-cover-image {
 
-	background-color: #{map-deep-get($config-global, "color", "foreground", "default")};
+	background-color: #{map-deep-get($config-cover, "color", "background")};
 	min-height: #{map-deep-get($config-cover, "height")};
 	margin: inherit;
 
 	.wp-block-cover__inner-container,
 	.wp-block-cover-image-text,
 	.wp-block-cover-text {
-		color: #{map-deep-get($config-global, "color", "background", "default")};
+		color: #{map-deep-get($config-cover, "color", "foreground")};
 		margin-top: #{map-deep-get($config-global, "spacing", "vertical")};
 		margin-bottom: #{map-deep-get($config-global, "spacing", "vertical")};
 

varia/sass/child-theme/_config-child-theme-deep.scss

@@ -188,7 +188,11 @@ $config-button: (
  * Cover
  */
 $config-cover: (
-	"height": calc( 15 * #{map-deep-get($config-global, "spacing", "vertical")} ),
+	"height": #{15 * map-deep-get($config-global, "spacing", "vertical")},
+	"color": (
+		"foreground": #{map-deep-get($config-global, "color", "white")},
+		"background": #{map-deep-get($config-global, "color", "black")},
+	)
 );
 
 /**

varia/style-editor.css

@@ -283,26 +283,31 @@ object {
 
 .wp-block-cover,
 .wp-block-cover-image {
-	background-color: #444444;
-	min-height: calc( 15 * 32px);
+	background-color: black;
+	color: white;
+	min-height: 480px;
 	/* Treating H2 separately to account for legacy /core styles */
 }
 
 .wp-block-cover .wp-block-cover__inner-container,
 .wp-block-cover .wp-block-cover-image-text,
 .wp-block-cover .wp-block-cover-text,
+.wp-block-cover .block-editor-block-list__block,
 .wp-block-cover-image .wp-block-cover__inner-container,
 .wp-block-cover-image .wp-block-cover-image-text,
-.wp-block-cover-image .wp-block-cover-text {
+.wp-block-cover-image .wp-block-cover-text,
+.wp-block-cover-image .block-editor-block-list__block {
 	color: white;
 }
 
 .wp-block-cover .wp-block-cover__inner-container a,
 .wp-block-cover .wp-block-cover-image-text a,
 .wp-block-cover .wp-block-cover-text a,
+.wp-block-cover .block-editor-block-list__block a,
 .wp-block-cover-image .wp-block-cover__inner-container a,
 .wp-block-cover-image .wp-block-cover-image-text a,
-.wp-block-cover-image .wp-block-cover-text a {
+.wp-block-cover-image .wp-block-cover-text a,
+.wp-block-cover-image .block-editor-block-list__block a {
 	color: currentColor;
 }
 

varia/style-rtl.css

@@ -1171,8 +1171,8 @@ input.has-focus[type="submit"],
 
 .wp-block-cover,
 .wp-block-cover-image {
-	background-color: #444444;
-	min-height: calc( 15 * 32px);
+	background-color: black;
+	min-height: 480px;
 	margin: inherit;
 	/* Treating H2 separately to account for legacy /core styles */
 	/**

varia/style.css

@@ -1171,8 +1171,8 @@ input.has-focus[type="submit"],
 
 .wp-block-cover,
 .wp-block-cover-image {
-	background-color: #444444;
-	min-height: calc( 15 * 32px);
+	background-color: black;
+	min-height: 480px;
 	margin: inherit;
 	/* Treating H2 separately to account for legacy /core styles */
 	/**