-
Notifications
You must be signed in to change notification settings - Fork 4.6k
Description
The Post Template block currently uses an ad hoc approach to generating flex layout rules for its option for a grid view. This ad hoc approach adds an is-flex-container
classname, linked to some hard-coded rules in its style.scss
file, here:
&.is-flex-container { |
It would be good to refactor the approach of this block to use the layout block support's flex type for the grid styles (is-layout-flex
), so that we can then directly opt-in to blockGap
support, to allow flexible control over the spacing between instances of the Post Template block.
Tasks to address
- Replace the
is-flex-container
rules with the ability to switch between flow / flex layout types using the layout block support (or should this always beflex
, but use vertical orientation as the switch?) - Work out how to reliably swap out the
width
rules and their calculation so that the ad hoc columns rules still work as-is - Ensure backwards compatibility with the block's existing
gap: 1.25em
rule, when making the switch - Opt-in to
blockGap
controls to allow spacing between instances of the Post Template block
Why
The overall goal would be to utilise the layout block support for all structural layout styling of this block, so that users can have control over block spacing and content justification, and so that if and when additional layout types are rolled out, these can be used in the Post Template / Query Loop blocks, too, enabling a wider variety of designs.
Related issues (and semi-related issues)
This issue has been touched on already in other feature requests — because those feature requests are typically from the perspective of the user of the theme, I thought it'd be helpful to have a separate issue for tracking the technical issues in implementing those changes. This issue should primarily be for tracking / breaking down the tasks of refactoring away the block's ad hoc layout rules.
- Query Loop block: Add the following panels - Dimensions and Border #39380
- Block: Post Template: Allow setting up custom gap #48224
- Make .wp-block-post stylable via theme.json #39599
- Would love see equal height when Query loop grid layout #41410 (flags the need for design tools at the Post Template level)