Support for Jetpack Form Block #2153
Conversation
🦋 Changeset detectedLatest commit: e733007 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
✅ Deploy Preview for cloudfour-patterns ready!
To edit notification comments on pull requests, go to your Netlify site settings. |
| <p></p> | ||
| <div class="field-name">Consent:</div> | ||
| <div class="field-value">Yes</div> | ||
| <p></p> |
There was a problem hiding this comment.
It's wild that this is the markup Jetpack forms output. This has got to be used on so many websites... (Not a blocker at all, just... come on Jetpack...)
|
|
||
| /// The submission message markup seems _ancient_. It apppears to be using | ||
| /// empty paragraphs to create spacing between elements. Luckily we're able to | ||
| /// style things adequately in spite of this. |
There was a problem hiding this comment.
I wonder if we should be adding p:empty { display: none } to yoink those empty paragraphs out of the a11y tree?
There was a problem hiding this comment.
@Paul-Hebert I've made this change (see e733007), but it required refactoring the way the layout of this CSS works (since the hidden paragraphs no longer allowed the inline-block elements to break). I think this is better from the end user's perspective, just FYI when it comes time to re-review!
Overview
Extends styles for input components to classes related to the Jetpack form block, allowing us to experiment with targeted contact forms in WordPress.
Screenshots
Testing
On the deploy preview, confirm: