Browse Source

Rainfall: Add a comment form to the single template

Ben Dwyer 3 years ago
parent
commit
ca859b43e6
4 changed files with 103 additions and 36 deletions
  1. 16 18
      rainfall/parts/footer.html
  2. 1 1
      rainfall/parts/header.html
  3. 61 1
      rainfall/templates/single.html
  4. 25 16
      rainfall/theme.json

+ 16 - 18
rainfall/parts/footer.html

@@ -1,21 +1,19 @@
 <!-- wp:group {"layout":{"inherit":"true"}} -->
-<div class="wp-block-group">
-<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"30px","bottom":"60px"}}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"space-between"}} -->
+<div class="wp-block-group"><!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"30px","bottom":"60px"}}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"space-between"}} -->
 <div class="wp-block-group alignwide" style="padding-top:30px;padding-bottom:60px"><!-- wp:site-title {"textAlign":"left","fontSize":"small"} /-->
-	
-	<!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap"}} -->
-	<div class="wp-block-group"><!-- wp:paragraph -->
-	<p><a href="https://facebook.com/">Facebook</a></p>
-	<!-- /wp:paragraph -->
-	
-	<!-- wp:paragraph {"align":"right"} -->
-	<p class="has-text-align-right"><a href="https://instagram.com/">Instagram</a></p>
-	<!-- /wp:paragraph -->
-	
-	<!-- wp:paragraph {"align":"center"} -->
-	<p class="has-text-align-center"><a href="https://twitter.com/">Twitter</a></p>
-	<!-- /wp:paragraph --></div>
-	<!-- /wp:group --></div>
-	<!-- /wp:group -->
-</div>
+
+<!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap"}} -->
+<div class="wp-block-group"><!-- wp:paragraph -->
+<p><a href="https://facebook.com/">Facebook</a></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:paragraph {"align":"right"} -->
+<p class="has-text-align-right"><a href="https://instagram.com/">Instagram</a></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:paragraph {"align":"center"} -->
+<p class="has-text-align-center"><a href="https://twitter.com/">Twitter</a></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
 <!-- /wp:group -->

+ 1 - 1
rainfall/parts/header.html

@@ -8,4 +8,4 @@
 <!-- wp:spacer {"height":"60px"} -->
 <div style="height:60px" aria-hidden="true" class="wp-block-spacer"></div>
 <!-- /wp:spacer --></div>
-<!-- /wp:group -->
+<!-- /wp:group -->

+ 61 - 1
rainfall/templates/single.html

@@ -38,4 +38,64 @@
 <!-- /wp:columns --></div>
 <!-- /wp:group -->
 
-<!-- wp:template-part {"slug":"footer"} /-->
+<!-- wp:paragraph -->
+<p></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:group {"style":{"elements":{"link":{"color":{"text":"var:preset|color|white"}}}},"backgroundColor":"black","textColor":"white","layout":{"inherit":true}} -->
+<div class="wp-block-group has-white-color has-black-background-color has-text-color has-background has-link-color"><!-- wp:spacer {"height":"10px"} -->
+<div style="height:10px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
+
+<!-- wp:columns -->
+<div class="wp-block-columns"><!-- wp:column {"width":""} -->
+<div class="wp-block-column"><!-- wp:comments-query-loop -->
+<div class="wp-block-comments-query-loop"><!-- wp:comments-title /-->
+
+<!-- wp:comment-template -->
+<!-- wp:columns {"style":{"border":{"top":{"width":"0px","style":"none"},"right":{"width":"0px","style":"none"},"bottom":{"color":"var:preset|color|white","width":"1px"},"left":{"width":"0px","style":"none"}},"spacing":{"margin":{"top":"0px","bottom":"0px"},"padding":{"top":"2.5rem","bottom":"2.5rem"}}}} -->
+<div class="wp-block-columns" style="border-top-style:none;border-top-width:0px;border-right-style:none;border-right-width:0px;border-bottom-color:var(--wp--preset--color--white);border-bottom-width:1px;border-left-style:none;border-left-width:0px;margin-top:0px;margin-bottom:0px;padding-top:2.5rem;padding-bottom:2.5rem"><!-- wp:column -->
+<div class="wp-block-column"><!-- wp:comment-author-name {"fontSize":"small"} /-->
+
+<!-- wp:group {"style":{"spacing":{"margin":{"top":"0px","bottom":"0px"}}},"layout":{"type":"flex"}} -->
+<div class="wp-block-group" style="margin-top:0px;margin-bottom:0px"><!-- wp:comment-date {"fontSize":"small"} /-->
+
+<!-- wp:comment-edit-link {"fontSize":"small"} /--></div>
+<!-- /wp:group -->
+
+<!-- wp:comment-content /-->
+
+<!-- wp:comment-reply-link {"fontSize":"small"} /--></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns -->
+<!-- /wp:comment-template -->
+
+<!-- wp:comments-pagination -->
+<!-- wp:comments-pagination-previous /-->
+
+<!-- wp:comments-pagination-numbers /-->
+
+<!-- wp:comments-pagination-next /-->
+<!-- /wp:comments-pagination -->
+
+<!-- wp:post-comments-form /--></div>
+<!-- /wp:comments-query-loop --></div>
+<!-- /wp:column -->
+
+<!-- wp:column {"width":"18rem"} -->
+<div class="wp-block-column" style="flex-basis:18rem"><!-- wp:paragraph -->
+<p></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns -->
+
+<!-- wp:group -->
+<div class="wp-block-group"></div>
+<!-- /wp:group -->
+
+<!-- wp:columns {"align":"wide"} -->
+<div class="wp-block-columns alignwide"><!-- wp:column -->
+<div class="wp-block-column"><!-- wp:template-part {"slug":"footer"} /--></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns --></div>
+<!-- /wp:group -->

+ 25 - 16
rainfall/theme.json

@@ -109,6 +109,20 @@
 					"textTransform": "uppercase"
 				}
 			},
+			"core/post-comments-form": {
+				"elements": {
+					"button": {
+						"color": {
+							"background": {
+								"ref": "styles.color.background"
+							},
+							"text": {
+								"ref": "styles.color.text"
+							}
+						}
+					}
+				}
+			},
 			"core/post-featured-image": {
 				"filter": {
 					"duotone": "var(--wp--preset--duotone--grayscale)"
@@ -164,14 +178,14 @@
 					}
 				}
 			},
+			"core/separator": {
+				"border": {
+					"width": "0 0 1px 0"
+				}
+			},
 			"core/site-title": {
 				"elements": {
 					"link": {
-						"color": {
-							"text": {
-								"ref": "styles.color.text"
-							}
-						},
 						"typography": {
 							"textDecoration": "none"
 						}
@@ -184,11 +198,6 @@
 						"ref": "styles.typography.lineHeight"
 					}
 				}
-			},
-			"core/separator": {
-				"border": {
-					"width": "0 0 1px 0"
-				}
 			}
 		},
 		"color": {
@@ -223,43 +232,43 @@
 			},
 			"h1": {
 				"typography": {
-					"fontWeight": "400",
 					"fontSize": "clamp(4rem, 6vw, 6.5rem)",
+					"fontWeight": "400",
 					"lineHeight": "0.92"
 				}
 			},
 			"h2": {
 				"typography": {
-					"fontWeight": "400",
 					"fontSize": "clamp(2rem, 5vw, 2.375rem)",
+					"fontWeight": "400",
 					"lineHeight": "1"
 				}
 			},
 			"h3": {
 				"typography": {
-					"fontWeight": "700",
 					"fontSize": "var(--wp--preset--font-size--x-large)",
+					"fontWeight": "700",
 					"lineHeight": "1.2"
 				}
 			},
 			"h4": {
 				"typography": {
-					"fontWeight": "700",
 					"fontSize": "1.75rem",
+					"fontWeight": "700",
 					"lineHeight": "1.1"
 				}
 			},
 			"h5": {
 				"typography": {
-					"fontWeight": "700",
 					"fontSize": "1.5rem",
+					"fontWeight": "700",
 					"lineHeight": "1.2"
 				}
 			},
 			"h6": {
 				"typography": {
-					"fontWeight": "700",
 					"fontSize": "var(--wp--preset--font-size--small)",
+					"fontWeight": "700",
 					"lineHeight": "1.3"
 				}
 			},