diff --git a/packages/block-library/src/gallery/edit.js b/packages/block-library/src/gallery/edit.js index ca88bc5f55a307..fcf5320f761513 100644 --- a/packages/block-library/src/gallery/edit.js +++ b/packages/block-library/src/gallery/edit.js @@ -471,7 +471,7 @@ function GalleryEdit( props ) { const gap = attributes.style?.spacing?.blockGap ? `#block-${ clientId } { --wp--style--unstable-gallery-gap: ${ attributes.style.spacing.blockGap } }` - : `#block-${ clientId } { --wp--style--unstable-gallery-gap: var( --wp--style--block-gap ) }`; + : `#block-${ clientId } { --wp--style--unstable-gallery-gap: var( --wp--style--block-gap, 0.5em ) }`; const GapStyle = () => { return ; diff --git a/packages/block-library/src/gallery/index.php b/packages/block-library/src/gallery/index.php index e73a092e88067e..efe00b23de6b5a 100644 --- a/packages/block-library/src/gallery/index.php +++ b/packages/block-library/src/gallery/index.php @@ -44,11 +44,11 @@ function block_core_gallery_data_id_backcompatibility( $parsed_block ) { * @return string The content of the block being rendered. */ function block_core_gallery_render( $attributes, $content ) { - $gap_value = _wp_array_get( $attributes, array( 'style', 'spacing', 'blockGap' ) ); + $gap = _wp_array_get( $attributes, array( 'style', 'spacing', 'blockGap' ) ); // Skip if gap value contains unsupported characters. // Regex for CSS value borrowed from `safecss_filter_attr`, and used here // because we only want to match against the value, not the CSS attribute. - $gap_value = preg_match( '%[\\\(&=}]|/\*%', $gap_value ) ? null : $gap_value; + $gap = preg_match( '%[\\\(&=}]|/\*%', $gap ) ? null : $gap; $id = uniqid(); $class = 'wp-block-gallery-' . $id; $content = preg_replace( @@ -57,6 +57,7 @@ function block_core_gallery_render( $attributes, $content ) { $content, 1 ); + $gap_value = $gap ? $gap : 'var( --wp--style--block-gap, 0.5em )'; $style = '.' . $class . '{ --wp--style--unstable-gallery-gap: ' . $gap_value . '}'; // Ideally styles should be loaded in the head, but blocks may be parsed // after that, so loading in the footer for now.