removed comments css and integrated comments block

Automattic · Jul 1, 2022 · ec1f33c · ec1f33c
1 parent 83f4768
commit ec1f33c
Show file tree

Hide file tree

Showing 5 changed files with 67 additions and 302 deletions.
diff --git a/blockbase/assets/ponyfill.css b/blockbase/assets/ponyfill.css
diff --git a/blockbase/block-templates/single.html b/blockbase/block-templates/single.html
@@ -21,7 +21,43 @@
     <!-- wp:spacer {"height":60} -->
     <div style="height:60px" aria-hidden="true" class="wp-block-spacer"></div>
     <!-- /wp:spacer -->
-    <!-- wp:post-comments /-->
+
+    <!-- wp:comments-query-loop -->
+<div class="wp-block-comments-query-loop"><!-- wp:comments-title /-->
+
+    <!-- wp:comment-template -->
+    <!-- wp:columns -->
+    <div class="wp-block-columns"><!-- wp:column {"width":"40px"} -->
+    <div class="wp-block-column" style="flex-basis:40px"><!-- wp:avatar {"size":40,"style":{"border":{"radius":"20px"}}} /--></div>
+    <!-- /wp:column -->
+
+    <!-- wp:column -->
+    <div class="wp-block-column"><!-- wp:comment-author-name /-->
+
+    <!-- wp:group {"style":{"spacing":{"margin":{"top":"0px","bottom":"0px"},"blockGap":"0.5em"}},"layout":{"type":"flex"}} -->
+    <div class="wp-block-group" style="margin-top:0px;margin-bottom:0px"><!-- wp:comment-date /-->
+
+    <!-- wp:comment-edit-link /--></div>
+    <!-- /wp:group -->
+
+    <!-- wp:comment-content /-->
+
+    <!-- wp:comment-reply-link /--></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:group -->
 

diff --git a/blockbase/sass/blocks/_post-comments.scss b/blockbase/sass/blocks/_post-comments.scss
diff --git a/blockbase/sass/ponyfill.scss b/blockbase/sass/ponyfill.scss
@@ -17,7 +17,6 @@
 @import "blocks/navigation";
 @import "blocks/paragraph";
 @import "blocks/post-author";
-@import "blocks/post-comments";
 @import "blocks/post-template";
 @import "blocks/pullquote";
 @import "blocks/query-pagination";

diff --git a/blockbase/theme.json b/blockbase/theme.json
@@ -433,6 +433,36 @@
 					"fontFamily": "monospace"
 				}
 			},
+			"core/comment-author-name": {
+				"typography": {
+					"fontSize": "var(--wp--custom--font-sizes--x-small)"
+				}
+			},
+			"core/comment-date": {
+				"typography": {
+					"fontSize": "var(--wp--custom--font-sizes--x-small)"
+				}
+			},
+			"core/comment-edit-link": {
+				"typography": {
+					"fontSize": "var(--wp--custom--font-sizes--x-small)"
+				}
+			},
+			"core/comment-reply-link": {
+				"color": {
+					"text": "var(--wp--custom--color--primary)"
+				},
+				"typography": {
+					"fontSize": "var(--wp--custom--font-sizes--x-small)",
+					"textDecoration": "underline"
+				}
+			},
+			"core/comment-content": {
+				"typography": {
+					"fontSize": "var(--wp--custom--post-comment--typography--font-size)",
+					"lineHeight": "var(--wp--custom--post-comment--typography--line-height)"
+				}
+			},
 			"core/gallery": {
 				"spacing": {
 					"margin": {