From ae42e8ec290859e1a5775324786ad9aef18ad1d7 Mon Sep 17 00:00:00 2001 From: Ella <4710635+ellatrix@users.noreply.github.com> Date: Tue, 9 Jul 2024 12:27:46 +0200 Subject: [PATCH] Styles specificity: allow comment form input overrides (#62960) Co-authored-by: ellatrix Co-authored-by: tellthemachines Co-authored-by: talldan --- .../src/post-comments-form/style.scss | 27 ++++++++++--------- 1 file changed, 15 insertions(+), 12 deletions(-) diff --git a/packages/block-library/src/post-comments-form/style.scss b/packages/block-library/src/post-comments-form/style.scss index 52b00a2c4f6cee..7bb7e150e68246 100644 --- a/packages/block-library/src/post-comments-form/style.scss +++ b/packages/block-library/src/post-comments-form/style.scss @@ -1,3 +1,18 @@ +// Allow these default styles to be overridden by global styles. +:where(.wp-block-post-comments-form) { + textarea, + input:not([type="submit"]) { + border: 1px solid $gray-600; + font-size: 1em; + font-family: inherit; + } + + textarea, + input:where(:not([type="submit"]):not([type="checkbox"])) { + padding: calc(0.667em + 2px); // The extra 2px is added to match outline buttons. + } +} + .wp-block-post-comments-form { // This block has customizable padding, border-box makes that more predictable. box-sizing: border-box; @@ -31,18 +46,6 @@ overflow-wrap: break-word; } - textarea, - input:not([type="submit"]) { - border: 1px solid $gray-600; - font-size: 1em; - font-family: inherit; - } - - textarea, - input:not([type="submit"]):not([type="checkbox"]) { - padding: calc(0.667em + 2px); // The extra 2px is added to match outline buttons. - } - .comment-form { textarea, // Make sure to not set display block on hidden input fields, to prevent