浏览代码

Skatepark: refactor post title margins (#4561)

* refactor post title margins

* exclude the query block post title from the underlined rules
Maggie 3 年之前
父节点
当前提交
c0c1ed7205

+ 8 - 13
skatepark/assets/theme.css

@@ -175,9 +175,10 @@ p {
 	text-decoration: none;
 }
 
-.wp-block-post-title:not(.has-featured-image .wp-block-post-title) {
+h1.wp-block-post-title:not(.has-featured-image .wp-block-post-title) {
 	border-bottom: var(--wp--custom--form--border--width) var(--wp--custom--form--border--style) var(--wp--preset--color--primary);
 	padding-bottom: calc( var(--wp--custom--margin--vertical) * 2);
+	margin-bottom: 0;
 }
 
 .wp-block-query-pagination .wp-block-query-pagination-numbers .current {
@@ -599,18 +600,6 @@ header.wp-block-template-part .site-brand .wp-block-site-tagline {
 	}
 }
 
-.archive .wp-block-query-title,
-.blog .wp-block-query-title,
-.home .wp-block-query-title {
-	margin-bottom: 0;
-}
-
-.archive .wp-block-post-title,
-.blog .wp-block-post-title,
-.home .wp-block-post-title {
-	margin-bottom: calc( 0.5 * var(--wp--custom--margin--vertical));
-}
-
 .archive .wp-block-post-excerpt__excerpt,
 .blog .wp-block-post-excerpt__excerpt,
 .home .wp-block-post-excerpt__excerpt {
@@ -626,6 +615,12 @@ header.wp-block-template-part .site-brand .wp-block-site-tagline {
 	text-underline-offset: 0.46ex;
 }
 
+.archive .wp-block-query .wp-block-post-title,
+.blog .wp-block-query .wp-block-post-title,
+.home .wp-block-query .wp-block-post-title {
+	margin-bottom: calc( 0.5 * var(--wp--custom--margin--vertical));
+}
+
 .wp-block-post-excerpt__more-link {
 	font-weight: 500;
 }

+ 2 - 2
skatepark/block-templates/index.html

@@ -1,7 +1,7 @@
 <!-- wp:template-part {"slug":"header","tagName":"header"} /-->
 
-<!-- wp:group {"tagName":"main","style":{"spacing":{"padding":{"top":"2.5em","bottom":"2.5em"}}},"layout":{"inherit":true}} -->
-<main class="wp-block-group" style="padding-top:2.5em;padding-bottom:2.5em">
+<!-- wp:group {"tagName":"main","style":{"spacing":{"padding":{"top":"4em","bottom":"2.5em"}}},"layout":{"inherit":true}} -->
+<main class="wp-block-group" style="padding-top:4em;padding-bottom:2.5em">
 	<!-- wp:query-title {"type":"archive","align":"wide"} /-->
 	<!-- wp:query {"query":{"perPage":6,"pages":0,"offset":0,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"exclude","inherit":false},"displayLayout":{"type":"flex","columns":3},"align":"wide"} -->
 	<div class="wp-block-query alignwide"><!-- wp:post-template -->

+ 2 - 2
skatepark/block-templates/page.html

@@ -1,7 +1,7 @@
 <!-- wp:template-part {"slug":"header","tagName":"header"} /-->
 
-<!-- wp:group {"layout":{"inherit":true},"style":{"spacing":{"padding":{"top":"2.5em"}}}} -->
-<div class="wp-block-group" style="padding-top:2.5em"><!-- wp:post-title {"level":1,"align":"wide"} /--></div>
+<!-- wp:group {"layout":{"inherit":true},"style":{"spacing":{"padding":{"top":"4em"}}}} -->
+<div class="wp-block-group" style="padding-top:4em"><!-- wp:post-title {"level":1,"align":"wide"} /--></div>
 <!-- /wp:group -->
 
 <!-- wp:group {"tagName":"main","style":{"spacing":{"padding":{"bottom":"5em"}}}} -->

+ 3 - 3
skatepark/block-templates/single.html

@@ -1,14 +1,14 @@
 <!-- wp:template-part {"slug":"header","tagName":"header"} /-->
 
-<!-- wp:group {"layout":{"inherit":true},"style":{"spacing":{"padding":{"top":"2.5em"}}}} -->
-<div class="wp-block-group" style="padding-top:2.5em"><!-- wp:post-title {"level":1,"align":"wide"} /--></div>
+<!-- wp:group {"layout":{"inherit":true},"style":{"spacing":{"padding":{"top":"4em"}}}} -->
+<div class="wp-block-group" style="padding-top:4em"><!-- wp:post-title {"level":1,"align":"wide"} /--></div>
 <!-- /wp:group -->
 
 <!-- wp:group {"tagName":"main"} -->
 <main class="wp-block-group">
 
 <!-- wp:group {"align":"full","style":{"spacing":{"padding":{"bottom":"5em"}}}} -->
-<div class="wp-block-group" style="padding-bottom:5em">
+<div class="wp-block-group alignfull" style="padding-bottom:5em">
 <!-- wp:post-featured-image {"align":"full","style":{"color":{"duotone":["#000","#B9FB9C"]}}} /--></div>
 <!-- /wp:group -->
 

+ 5 - 0
skatepark/child-theme.json

@@ -291,6 +291,11 @@
 					"fontSize": "min(max(48px, 7vw), 72px)",
 					"fontWeight": "700",
 					"lineHeight": 1.2
+				},
+				"spacing": {
+					"margin": {
+						"bottom": "1em"
+					}
 				}
 			},
 			"core/post-navigation-link": {

+ 2 - 1
skatepark/sass/blocks/_post-title.scss

@@ -1,4 +1,5 @@
-.wp-block-post-title:not(.has-featured-image .wp-block-post-title) {
+h1.wp-block-post-title:not(.has-featured-image .wp-block-post-title) {
 	border-bottom: var(--wp--custom--form--border--width) var(--wp--custom--form--border--style) var(--wp--preset--color--primary);
 	padding-bottom: calc( var(--wp--custom--margin--vertical) * 2 );
+	margin-bottom: 0;
 }

+ 3 - 6
skatepark/sass/templates/_index.scss

@@ -1,12 +1,6 @@
 .archive,
 .blog,
 .home {
-	.wp-block-query-title {
-		margin-bottom: 0;
-	}
-	.wp-block-post-title{
-		margin-bottom: calc( 0.5 * var(--wp--custom--margin--vertical) );
-	}
 	.wp-block-post-excerpt__excerpt {
 		margin-top: calc( 0.5 * var(--wp--custom--margin--vertical) );
 		margin-bottom: calc( 0.5 * var(--wp--custom--margin--vertical) );
@@ -15,6 +9,9 @@
 		text-decoration: underline;
 		@include text-decoration;
 	}
+	.wp-block-query .wp-block-post-title{
+		margin-bottom: calc( 0.5 * var(--wp--custom--margin--vertical) );
+	}
 }
 
 .wp-block-post-excerpt__more-link {

+ 5 - 0
skatepark/theme.json

@@ -473,6 +473,11 @@
 					"fontSize": "min(max(48px, 7vw), 72px)",
 					"lineHeight": 1.2,
 					"fontWeight": "700"
+				},
+				"spacing": {
+					"margin": {
+						"bottom": "1em"
+					}
 				}
 			},
 			"core/post-date": {