ソースを参照

Varia: On mobile, limit spacer-block to 32px height and force zero vertical margins

Allan Cole 6 年 前
コミット
c477b2c136

+ 1 - 1
varia/sass/abstracts/_mixins.scss

@@ -5,7 +5,7 @@
 @mixin media( $res ) {
 
 	@if mobile-only == $res {
-		@media only screen and (max-width: calc(map-deep-get($config-global, "breakpoint", "sm") - 1)) {
+		@media only screen and (max-width: #{map-deep-get($config-global, "breakpoint", "sm") - 1}) {
 			@content;
 		}
 	}

+ 8 - 2
varia/sass/blocks/spacer/_style.scss

@@ -1,6 +1,12 @@
 .wp-block-spacer {
 	display: block;
 	// Remove vertical margins
-	margin-bottom: 0;
-	margin-top: 0;
+	margin-bottom: 0 !important;
+	margin-top: 0 !important;
+
+	@include media(mobile-only) {
+		&[style] {
+			height: map-deep-get($config-global, "spacing", "unit") !important;
+		}
+	}
 }

+ 8 - 2
varia/style-rtl.css

@@ -1810,8 +1810,14 @@ hr.is-style-dots:before {
 
 .wp-block-spacer {
 	display: block;
-	margin-bottom: 0;
-	margin-top: 0;
+	margin-bottom: 0 !important;
+	margin-top: 0 !important;
+}
+
+@media only screen and (max-width: 559px) {
+	.wp-block-spacer[style] {
+		height: 32px !important;
+	}
 }
 
 table,

+ 8 - 2
varia/style.css

@@ -1810,8 +1810,14 @@ hr.is-style-dots:before {
 
 .wp-block-spacer {
 	display: block;
-	margin-bottom: 0;
-	margin-top: 0;
+	margin-bottom: 0 !important;
+	margin-top: 0 !important;
+}
+
+@media only screen and (max-width: 559px) {
+	.wp-block-spacer[style] {
+		height: 16px !important;
+	}
 }
 
 table,