Exford: Rework Cover block height on small screens

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

@@ -188,7 +188,7 @@ $config-button: (
  * Cover
  */
 $config-cover: (
-	"height": 80vh,
+	"height": #{15 * map-deep-get($config-global, "spacing", "vertical")},
 );
 
 /**

exford/sass/_extra-child-theme.scss

@@ -218,6 +218,14 @@ a {
 	h6 {
 		font-size: #{map-deep-get($config-global, "font", "size", "md")};
 	}
+
+	@include media(mobile) {
+		min-height: 60vh;
+	}
+
+	@include media(laptop) {
+		min-height: 80vh;
+	}
 }
 
 /**

exford/sass/style-child-theme-editor.scss

@@ -65,4 +65,12 @@
 	h6 {
 		font-size: #{map-deep-get($config-global, "font", "size", "md")};
 	}
+
+	@include media(mobile) {
+		min-height: 60vh;
+	}
+
+	@include media(laptop) {
+		min-height: 80vh;
+	}
 }

exford/style-editor.css

@@ -328,7 +328,7 @@ object {
 .wp-block-cover,
 .wp-block-cover-image {
 	background-color: #111111;
-	min-height: 80vh;
+	min-height: 480px;
 	/* Treating H2 separately to account for legacy /core styles */
 }
 
@@ -890,3 +890,17 @@ table th,
 .wp-block-cover-image h6 {
 	font-size: 1.2rem;
 }
+
+@media only screen and (min-width: 560px) {
+	.wp-block-cover,
+	.wp-block-cover-image {
+		min-height: 60vh;
+	}
+}
+
+@media only screen and (min-width: 782px) {
+	.wp-block-cover,
+	.wp-block-cover-image {
+		min-height: 80vh;
+	}
+}

exford/style-rtl.css

@@ -1213,7 +1213,7 @@ input.has-focus[type="submit"],
 .wp-block-cover,
 .wp-block-cover-image {
 	background-color: #111111;
-	min-height: 80vh;
+	min-height: 480px;
 	margin: inherit;
 	/* Treating H2 separately to account for legacy /core styles */
 	/**
@@ -3575,6 +3575,20 @@ p:not(.site-title) a:hover {
 	font-size: 1.2rem;
 }
 
+@media only screen and (min-width: 560px) {
+	.wp-block-cover,
+	.wp-block-cover-image {
+		min-height: 60vh;
+	}
+}
+
+@media only screen and (min-width: 782px) {
+	.wp-block-cover,
+	.wp-block-cover-image {
+		min-height: 80vh;
+	}
+}
+
 /**
  * Widgets
  */

exford/style.css

@@ -1213,7 +1213,7 @@ input.has-focus[type="submit"],
 .wp-block-cover,
 .wp-block-cover-image {
 	background-color: #111111;
-	min-height: 80vh;
+	min-height: 480px;
 	margin: inherit;
 	/* Treating H2 separately to account for legacy /core styles */
 	/**
@@ -3591,6 +3591,20 @@ p:not(.site-title) a:hover {
 	font-size: 1.2rem;
 }
 
+@media only screen and (min-width: 560px) {
+	.wp-block-cover,
+	.wp-block-cover-image {
+		min-height: 60vh;
+	}
+}
+
+@media only screen and (min-width: 782px) {
+	.wp-block-cover,
+	.wp-block-cover-image {
+		min-height: 80vh;
+	}
+}
+
 /**
  * Widgets
  */