Row and Stack Block Variations Not Working in Frontend Due to Missing .is-layout-flex Styles

[georgeolaru]

Description

We have identified an issue where the Row and Stack block variations are not functioning as expected in the frontend. The root cause appears to be that the .is-layout-flex class is not applying the display: flex property to the block. This issue is affecting the layout and presentation of these blocks, causing them to not display correctly on the site.

Steps to Reproduce

1. Add a Row or Stack block to a page
2. Observe that the layout does not reflect the expected flex behaviorin frontend.

Expected Behavior

When adding Row or Stack blocks, they should automatically have the display: flex style applied through the .is-layout-flex class, ensuring that the block elements align correctly in a flex container.

Actual Behavior

The .is-layout-flex class does not apply display: flex to the block, resulting in incorrect layout and alignment of elements within the Row and Stack blocks.

Potential Cause

The issue seems to be linked to a line of code in the theme that removes SVG and global styles:

// Remove SVG and global styles
remove_action( 'wp_enqueue_scripts', 'wp_enqueue_global_styles' );

This removal seems to inadvertently prevent the .is-layout-flex class from applying the necessary styles.

Suggested Solution

A possible solution is to remove the aforementioned line from the theme, allowing the global styles, including those for .is-layout-flex, to be applied correctly. This change should restore the intended functionality of the Row and Stack blocks.