comment form style tweaks

Automattic · May 21, 2021 · 7ba60cb · 7ba60cb
1 parent 32d6155
commit 7ba60cb
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 9 deletions.
diff --git a/quadrat/assets/theme.css b/quadrat/assets/theme.css
diff --git a/quadrat/sass/blocks/_post-comments.scss b/quadrat/sass/blocks/_post-comments.scss
@@ -1,8 +1,8 @@
 .wp-block-post-comments {
-	.reply a {
-		font-size: 1em;
-		line-height: 1.2;
-	}
+	font-size: var(--wp--preset--font-size--normal);
+	line-height: var(--wp--custom--line-height--body);
+	//by changing the base font-size of the block, the em values of the reply button are not valid any more
+	//this needs to be consider along with https://github.com/Automattic/themes/pull/3881 changes
 
 	form {
 		display: grid;
@@ -20,7 +20,7 @@
 		textarea {
 			border: none;
 			background: var(--wp--custom--color--secondary);
-			font-size: 1em;
+			font-size: var(--wp--preset--font-size--normal);
 			width: 100%;
 		}
 
@@ -89,6 +89,24 @@
 		}
 	}
 
+	.reply {
+		margin-bottom: 30px;
+	}
+
+	.commentmetadata {
+		margin-bottom: 20px;
+	}
+
+	.commentlist {
+		margin-bottom: 60px;
+		.comment {
+			p {
+				font-size: var(--wp--preset--font-size--normal);
+				line-height: var(--wp--custom--line-height--body);
+			}
+		}
+	}
+
 	// Target certain links within post comments to use the underline treatment.
 	.comment-body > p > a,
 	.comment-edit-link {