Browse Source

Blockbase: Account for additional content via css grid configuration (#5816)

Jason Crist 3 years ago
parent
commit
662df18149
2 changed files with 8 additions and 1 deletions
  1. 4 1
      blockbase/assets/ponyfill.css
  2. 4 0
      blockbase/sass/blocks/_post-comments.scss

+ 4 - 1
blockbase/assets/ponyfill.css

@@ -641,7 +641,7 @@ p.has-drop-cap:not(:focus)::first-letter {
   display: grid;
   display: grid;
   column-gap: 1em;
   column-gap: 1em;
   grid-template-rows: auto;
   grid-template-rows: auto;
-  grid-template-areas: "notes notes" "author author" "email url" "comment comment" "cookies-consent cookies-consent" "form-submit form-submit";
+  grid-template-areas: "misc misc" "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 input:not([type=submit]):not([type=checkbox]),
 .wp-block-post-comments form textarea {
 .wp-block-post-comments form textarea {
@@ -664,6 +664,9 @@ p.has-drop-cap:not(:focus)::first-letter {
   margin-top: 0;
   margin-top: 0;
   margin-bottom: var(--wp--custom--gap--vertical);
   margin-bottom: var(--wp--custom--gap--vertical);
 }
 }
+.wp-block-post-comments form > * {
+  grid-area: misc;
+}
 .wp-block-post-comments form .comment-notes {
 .wp-block-post-comments form .comment-notes {
   grid-area: notes;
   grid-area: notes;
 }
 }

+ 4 - 0
blockbase/sass/blocks/_post-comments.scss

@@ -21,6 +21,7 @@
 		column-gap: 1em;
 		column-gap: 1em;
 		grid-template-rows: auto;
 		grid-template-rows: auto;
 		grid-template-areas:
 		grid-template-areas:
+			"misc misc"
 			"notes notes"
 			"notes notes"
 			"author author"
 			"author author"
 			"email url"
 			"email url"
@@ -52,6 +53,9 @@
 			margin-top: 0;
 			margin-top: 0;
 			margin-bottom: var(--wp--custom--gap--vertical);
 			margin-bottom: var(--wp--custom--gap--vertical);
 		}
 		}
+		& > * {
+			grid-area: misc;
+		}
 
 
 		.comment-notes {
 		.comment-notes {
 			grid-area: notes;
 			grid-area: notes;