Editor: Improves layout block support in wp_get_layout_style().

This commit merges the remaining changes from [https://github.com/WordPress/gutenberg/pull/40875 Gutenberg PR 40875]. It's Part 2 (see [54162] for Part 1) of a layout improvement initiative and targets `wp_get_layout_style()` in `layout.php`.

Context:
The overall initiative is to improve layout block support:
>to use centralised layout definitions, output base layout styles from global styles, introduce a layout type semantic classname, reduce duplication of container class and style tag output, and fix blockGap at the block level in global styles.

Changes include:
* Adding an optional parameter `$block_spacing` to `wp_get_layout_style()` for setting a custom spacing on the block.
* Adding handle for the block spacing.
* Using the style engine to to enqueue and render layout styles via `wp_style_engine_get_stylesheet_from_css_rules()`.
* Introduces a new test file for `wp_get_layout_style()`.

Follow-up to [54162], [54160], [54159], [53421], [52380], [53085], [52069].

Props andrewserong, isabel_brison, costdev, hellofromTonya.
See #56467.

git-svn-id: https://develop.svn.wordpress.org/trunk@54274 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Tonya Mork
2022-09-21 13:00:29 +00:00
parent 34ace2304b
commit 2d75ae23d6
7 changed files with 552 additions and 93 deletions

View File

@@ -1,5 +1,5 @@
<div class="wp-container-1 wp-block-column">
<div class="is-layout-flow wp-block-column">
<p>Column One, Paragraph One</p>

View File

@@ -1,7 +1,7 @@
<div class="wp-container-1 wp-block-columns has-3-columns">
<div class="is-layout-flex wp-container-1 wp-block-columns has-3-columns">
<div class="wp-container-1 wp-block-column">
<div class="is-layout-flow wp-block-column">
<p>Column One, Paragraph One</p>
@@ -11,7 +11,7 @@
</div>
<div class="wp-container-1 wp-block-column">
<div class="is-layout-flow wp-block-column">
<p>Column Two, Paragraph One</p>

View File

@@ -1,5 +1,5 @@
<div class="wp-container-1 wp-block-columns has-3-columns">
<div class="is-layout-flex wp-container-1 wp-block-columns has-3-columns">
<p class="layout-column-1">Column One, Paragraph One</p>

View File

@@ -1,5 +1,5 @@
<figure class="wp-container-1 wp-block-gallery-1 wp-block-gallery has-nested-images columns-default is-cropped columns-2">
<figure class="is-layout-flex wp-block-gallery-1 wp-block-gallery has-nested-images columns-default is-cropped columns-2">
<figure class="wp-block-image size-large">
<img src="https://cldup.com/uuUqE_dXzy.jpg" alt="Image gallery image" />

View File

@@ -1,5 +1,5 @@
<figure class="wp-container-1 wp-block-gallery-1 wp-block-gallery has-nested-images is-cropped columns-1" >
<figure class="is-layout-flex wp-block-gallery-1 wp-block-gallery has-nested-images is-cropped columns-1" >
<figure class="wp-block-image size-large">
<img src="https://cldup.com/uuUqE_dXzy.jpg" alt="Image gallery image" />