Blockbase: Remove wpcom specific CSS file (#4548)

blockbase/assets/ponyfill.css

@@ -408,6 +408,41 @@ p.has-background {
 	font-weight: var(--wp--custom--post-author--font-weight);
 }
 
+body:not(.highlander-enabled) .wp-block-post-comments form {
+	display: grid;
+	column-gap: 1em;
+	grid-template-rows: auto;
+	grid-template-areas: "notes notes" "author author" "email url" "comment comment" "cookies-consent cookies-consent" "form-submit form-submit";
+}
+
+body:not(.highlander-enabled) .wp-block-post-comments form .comment-notes {
+	grid-area: notes;
+}
+
+body:not(.highlander-enabled) .wp-block-post-comments form .comment-form-author {
+	grid-area: author;
+}
+
+body:not(.highlander-enabled) .wp-block-post-comments form .comment-form-email {
+	grid-area: email;
+}
+
+body:not(.highlander-enabled) .wp-block-post-comments form .comment-form-url {
+	grid-area: url;
+}
+
+body:not(.highlander-enabled) .wp-block-post-comments form .comment-form-comment {
+	grid-area: comment;
+}
+
+body:not(.highlander-enabled) .wp-block-post-comments form .comment-form-cookies-consent {
+	grid-area: cookies-consent;
+}
+
+body:not(.highlander-enabled) .wp-block-post-comments form .form-submit {
+	grid-area: form-submit;
+}
+
 .wp-block-post-comments label, .wp-block-post-comments .comment-meta {
 	font-size: var(--wp--custom--form--label--typography--font-size);
 }
@@ -426,13 +461,6 @@ p.has-background {
 	text-decoration: none;
 }
 
-.wp-block-post-comments form {
-	display: grid;
-	column-gap: 1em;
-	grid-template-rows: auto;
-	grid-template-areas: "notes notes" "author author" "email url" "comment comment" "cookies-consent cookies-consent" "form-submit form-submit";
-}
-
 .wp-block-post-comments form input:not([type=submit]):not([type=checkbox]),
 .wp-block-post-comments form textarea {
 	font-size: var(--wp--preset--font-size--normal);
@@ -458,34 +486,6 @@ p.has-background {
 	margin-bottom: var(--wp--custom--margin--vertical);
 }
 
-.wp-block-post-comments form .comment-notes {
-	grid-area: notes;
-}
-
-.wp-block-post-comments form .comment-form-author {
-	grid-area: author;
-}
-
-.wp-block-post-comments form .comment-form-email {
-	grid-area: email;
-}
-
-.wp-block-post-comments form .comment-form-url {
-	grid-area: url;
-}
-
-.wp-block-post-comments form .comment-form-comment {
-	grid-area: comment;
-}
-
-.wp-block-post-comments form .comment-form-cookies-consent {
-	grid-area: cookies-consent;
-}
-
-.wp-block-post-comments form .form-submit {
-	grid-area: form-submit;
-}
-
 .wp-block-post-comments form .comment-form-cookies-consent input[type="checkbox"] {
 	border: 0;
 	clip: rect(1px, 1px, 1px, 1px);

blockbase/inc/wpcom-style.css

@@ -1,8 +0,0 @@
-/**
- * WP.com stylesheet for Blockbase
- */
-
-/* NOTE: This is a wp.com-specific fix so that the comment form presented there (highlander) is NOT displayed as a GRID. */
-body.highlander-enabled .wp-block-post-comments form {
-	display: revert;
-}

blockbase/inc/wpcom.php

@@ -7,15 +7,6 @@
  * @package Blockbase
  */
 
-/**
- * Enqueue our WP.com styles for front-end.
- * Loads after theme styles so we can add overrides.
- */
-function blockbase_wpcom_scripts() {
-	wp_enqueue_style( 'blockbase-wpcom-style', get_template_directory_uri() . '/inc/wpcom-style.css', array( 'blockbase-ponyfill' ) );
-}
-add_action( 'wp_enqueue_scripts', 'blockbase_wpcom_scripts' );
-
 /**
  * Restores the Customizer since we still rely on it.
  * (For WPcom REST API requests to work properly.)

blockbase/sass/blocks/_post-comments.scss

@@ -1,3 +1,48 @@
+body:not(.highlander-enabled) {
+	.wp-block-post-comments {
+		form {
+			display: grid;
+			column-gap: 1em;
+			grid-template-rows: auto;
+			grid-template-areas:
+				"notes notes"
+				"author author"
+				"email url"
+				"comment comment"
+				"cookies-consent cookies-consent"
+				"form-submit form-submit";
+
+			.comment-notes {
+				grid-area: notes;
+			}
+
+			.comment-form-author {
+				grid-area: author;
+			}
+
+			.comment-form-email {
+				grid-area: email;
+			}
+
+			.comment-form-url {
+				grid-area: url;
+			}
+
+			.comment-form-comment {
+				grid-area: comment;
+			}
+
+			.comment-form-cookies-consent {
+				grid-area: cookies-consent;
+			}
+
+			.form-submit {
+				grid-area: form-submit;
+			}
+		}
+	}
+}
+
 .wp-block-post-comments {
 	label, .comment-meta {
 		font-size: var(--wp--custom--form--label--typography--font-size);
@@ -17,17 +62,6 @@
 	}
 
 	form {
-		display: grid;
-		column-gap: 1em;
-		grid-template-rows: auto;
-		grid-template-areas:
-			"notes notes"
-			"author author"
-			"email url"
-			"comment comment"
-			"cookies-consent cookies-consent"
-			"form-submit form-submit";
-
 		input:not([type=submit]):not([type=checkbox]),
 		textarea {
 			font-size: var(--wp--preset--font-size--normal);
@@ -53,34 +87,6 @@
 			margin-bottom: var(--wp--custom--margin--vertical);
 		}
 
-		.comment-notes {
-			grid-area: notes;
-		}
-
-		.comment-form-author {
-			grid-area: author;
-		}
-
-		.comment-form-email {
-			grid-area: email;
-		}
-
-		.comment-form-url {
-			grid-area: url;
-		}
-
-		.comment-form-comment {
-			grid-area: comment;
-		}
-
-		.comment-form-cookies-consent {
-			grid-area: cookies-consent;
-		}
-
-		.form-submit {
-			grid-area: form-submit;
-		}
-
 		.comment-form-cookies-consent {
 			input[type="checkbox"] {
 				@include hide-accesibly;
@@ -132,7 +138,7 @@
 				font-size: var(--wp--custom--post-comment--typography--font-size);
 				line-height: var(--wp--custom--post-comment--typography--line-height);
 				margin-bottom: var(--wp--custom--margin--vertical);
-				margin-top: var(--wp--custom--margin--vertical);	
+				margin-top: var(--wp--custom--margin--vertical);
 			}
 		}
 	}