From 0dbd50d75519b080305502122bc706d235140c83 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9?= <583546+oandregal@users.noreply.github.com>
Date: Fri, 10 Dec 2021 18:17:20 +0100
Subject: [PATCH] The CSS Custom Properties for the presets need to be in
 editor settings

The reason is that there's a couple of places in which we render
styles coming from the block editor settings in a iframe
(media query previews, block patterns).
---
 lib/global-styles.php | 20 ++++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/lib/global-styles.php b/lib/global-styles.php
index 78802343c5c32d..1b65c6d45578de 100644
--- a/lib/global-styles.php
+++ b/lib/global-styles.php
@@ -72,19 +72,27 @@ function_exists( 'gutenberg_is_edit_site_page' ) &&
 
 		$new_global_styles = array();
 
-		$style_css = wp_get_global_stylesheet( array( 'presets' ) );
-		if ( '' !== $style_css ) {
+		$css_variables = wp_get_global_stylesheet( array( 'variables' ) );
+		if ( '' !== $css_variables ) {
 			$new_global_styles[] = array(
-				'css'            => $style_css,
+				'css'            => $css_variables,
+				'__unstableType' => 'presets',
+			);
+		}
+
+		$css_presets = wp_get_global_stylesheet( array( 'presets' ) );
+		if ( '' !== $css_presets ) {
+			$new_global_styles[] = array(
+				'css'            => $css_presets,
 				'__unstableType' => 'presets',
 			);
 		}
 
 		if ( WP_Theme_JSON_Resolver_Gutenberg::theme_has_support() ) {
-			$style_css = wp_get_global_stylesheet( array( 'styles' ) );
-			if ( '' !== $style_css ) {
+			$css_blocks = wp_get_global_stylesheet( array( 'styles' ) );
+			if ( '' !== $css_blocks ) {
 				$new_global_styles[] = array(
-					'css'            => $style_css,
+					'css'            => $css_blocks,
 					'__unstableType' => 'theme',
 				);
 			}