diff --git a/lib/global-styles.php b/lib/global-styles.php index 6c98d27220297..d8d1b8fee0fe8 100644 --- a/lib/global-styles.php +++ b/lib/global-styles.php @@ -5,15 +5,6 @@ * @package gutenberg */ -/** - * Whether the current theme has support for Global Styles. - * - * @return boolean - */ -function gutenberg_experimental_global_styles_has_theme_support() { - return is_readable( locate_template( 'experimental-theme.json' ) ); -} - /** * Given a Global Styles tree, it creates a flattened tree * whose keys are the CSS custom properties @@ -90,11 +81,11 @@ function gutenberg_experimental_global_styles_get_user() { * * @param array $post_status_filter Filter CPT by post status. * By default, only fetches published posts. - * @param bool $should_create_draft Whether a new draft should be created - * if no CPT was found. False by default. + * @param bool $should_create_cpt Whether a new draft should be created + * if no CPT was found. False by default. * @return array Custom Post Type for the user's Global Styles. */ -function gutenberg_experimental_global_styles_get_user_cpt( $post_status_filter = array( 'publish' ), $should_create_draft = false ) { +function gutenberg_experimental_global_styles_get_user_cpt( $post_status_filter = array( 'publish' ), $should_create_cpt = false ) { $user_cpt = array(); $post_type_filter = 'wp_global_styles'; $post_name_filter = 'wp-global-styles-' . strtolower( wp_get_theme()->get( 'TextDomain' ) ); @@ -111,11 +102,11 @@ function gutenberg_experimental_global_styles_get_user_cpt( $post_status_filter if ( is_array( $recent_posts ) && ( count( $recent_posts ) === 1 ) ) { $user_cpt = $recent_posts[0]; - } elseif ( $should_create_draft ) { + } elseif ( $should_create_cpt ) { $cpt_post_id = wp_insert_post( array( 'post_content' => '{}', - 'post_status' => 'draft', + 'post_status' => 'publish', 'post_type' => $post_type_filter, 'post_name' => $post_name_filter, ), @@ -148,7 +139,7 @@ function gutenberg_experimental_global_styles_get_user_cpt_id() { */ function gutenberg_experimental_global_styles_get_core() { return gutenberg_experimental_global_styles_get_from_file( - dirname( dirname( __FILE__ ) ) . '/experimental-default-global-styles.json' + dirname( __FILE__ ) . '/global-styles/experimental-default-global-styles.json' ); } @@ -164,15 +155,21 @@ function gutenberg_experimental_global_styles_get_theme() { } /** - * Takes a Global Styles tree and returns a CSS rule + * Takes core, theme, and user preferences, + * builds a single global styles tree and returns a CSS rule * that contains the corresponding CSS custom properties. * - * @param array $global_styles Global Styles tree. * @return string CSS rule. */ -function gutenberg_experimental_global_styles_resolver( $global_styles ) { +function gutenberg_experimental_global_styles_resolver() { $css_rule = ''; + $global_styles = array_replace_recursive( + gutenberg_experimental_global_styles_get_core(), + gutenberg_experimental_global_styles_get_theme(), + gutenberg_experimental_global_styles_get_user() + ); + $token = '--'; $prefix = '--wp' . $token; $css_vars = gutenberg_experimental_global_styles_get_css_vars( $global_styles, $prefix, $token ); @@ -189,32 +186,12 @@ function gutenberg_experimental_global_styles_resolver( $global_styles ) { return $css_rule; } -/** - * Fetches the Global Styles for each level (core, theme, user) - * and enqueues the resulting CSS custom properties for the editor. - */ -function gutenberg_experimental_global_styles_enqueue_assets_editor() { - if ( gutenberg_experimental_global_styles_is_site_editor() ) { - gutenberg_experimental_global_styles_enqueue_assets(); - } -} - /** * Fetches the Global Styles for each level (core, theme, user) * and enqueues the resulting CSS custom properties. */ function gutenberg_experimental_global_styles_enqueue_assets() { - if ( ! gutenberg_experimental_global_styles_has_theme_support() ) { - return; - } - - $global_styles = array_merge( - gutenberg_experimental_global_styles_get_core(), - gutenberg_experimental_global_styles_get_theme(), - gutenberg_experimental_global_styles_get_user() - ); - - $inline_style = gutenberg_experimental_global_styles_resolver( $global_styles ); + $inline_style = gutenberg_experimental_global_styles_resolver(); if ( empty( $inline_style ) ) { return; } @@ -224,51 +201,6 @@ function gutenberg_experimental_global_styles_enqueue_assets() { wp_enqueue_style( 'global-styles' ); } -/** - * Adds class wp-gs to the frontend body class. - * - * @param array $classes Existing body classes. - * @return array The filtered array of body classes. - */ -function gutenberg_experimental_global_styles_wp_gs_class_front_end( $classes ) { - if ( ! gutenberg_experimental_global_styles_has_theme_support() ) { - return $classes; - } - - return array_merge( $classes, array( 'wp-gs' ) ); -} - -/** - * Adds class wp-gs to the block-editor body class. - * - * @param string $classes Existing body classes separated by space. - * @return string The filtered string of body classes. - */ -function gutenberg_experimental_global_styles_wp_gs_class_editor( $classes ) { - if ( - ! gutenberg_experimental_global_styles_has_theme_support() || - ! gutenberg_experimental_global_styles_is_site_editor() - ) { - return $classes; - } - - return $classes . ' wp-gs'; -} - -/** - * Whether the loaded page is the site editor. - * - * @return boolean Whether the loaded page is the site editor. - */ -function gutenberg_experimental_global_styles_is_site_editor() { - if ( ! function_exists( 'get_current_screen' ) ) { - return false; - } - - $screen = get_current_screen(); - return ! empty( $screen ) && gutenberg_is_edit_site_page( $screen->id ); -} - /** * Makes the base Global Styles (core, theme) * and the ID of the CPT that stores the user's Global Styles @@ -278,13 +210,6 @@ function gutenberg_experimental_global_styles_is_site_editor() { * @return array New block editor settings */ function gutenberg_experimental_global_styles_settings( $settings ) { - if ( - ! gutenberg_experimental_global_styles_has_theme_support() || - ! gutenberg_experimental_global_styles_is_site_editor() - ) { - return $settings; - } - $settings['__experimentalGlobalStylesUserEntityId'] = gutenberg_experimental_global_styles_get_user_cpt_id(); $global_styles = array_merge( @@ -301,10 +226,6 @@ function gutenberg_experimental_global_styles_settings( $settings ) { * Registers a Custom Post Type to store the user's Global Styles. */ function gutenberg_experimental_global_styles_register_cpt() { - if ( ! gutenberg_experimental_global_styles_has_theme_support() ) { - return; - } - $args = array( 'label' => __( 'Global Styles', 'gutenberg' ), 'description' => 'CPT to store user design tokens', @@ -330,12 +251,8 @@ function gutenberg_experimental_global_styles_register_cpt() { register_post_type( 'wp_global_styles', $args ); } -if ( gutenberg_is_experiment_enabled( 'gutenberg-full-site-editing' ) ) { - add_action( 'init', 'gutenberg_experimental_global_styles_register_cpt' ); - add_filter( 'body_class', 'gutenberg_experimental_global_styles_wp_gs_class_front_end' ); - add_filter( 'admin_body_class', 'gutenberg_experimental_global_styles_wp_gs_class_editor' ); - add_filter( 'block_editor_settings', 'gutenberg_experimental_global_styles_settings' ); - // enqueue_block_assets is not fired in edit-site, so we use separate back/front hooks instead. - add_action( 'wp_enqueue_scripts', 'gutenberg_experimental_global_styles_enqueue_assets' ); - add_action( 'admin_enqueue_scripts', 'gutenberg_experimental_global_styles_enqueue_assets_editor' ); -} +add_action( 'init', 'gutenberg_experimental_global_styles_register_cpt' ); +add_filter( 'block_editor_settings', 'gutenberg_experimental_global_styles_settings' ); +// enqueue_block_assets is not fired in edit-site, so we use separate back/front hooks instead. +add_action( 'wp_enqueue_scripts', 'gutenberg_experimental_global_styles_enqueue_assets' ); +add_action( 'admin_enqueue_scripts', 'gutenberg_experimental_global_styles_enqueue_assets' ); diff --git a/experimental-default-global-styles.json b/lib/global-styles/experimental-default-global-styles.json similarity index 59% rename from experimental-default-global-styles.json rename to lib/global-styles/experimental-default-global-styles.json index da4314beaaf32..50fb9cf3e12f1 100644 --- a/experimental-default-global-styles.json +++ b/lib/global-styles/experimental-default-global-styles.json @@ -1,7 +1,9 @@ { "color": { - "primary": "#52accc", "background": "white", "text": "black" + }, + "typography": { + "line-height": 1.5 } } diff --git a/packages/block-library/src/button/style.scss b/packages/block-library/src/button/style.scss index 7bbe8900b8dc2..f2ad6bf77b130 100644 --- a/packages/block-library/src/button/style.scss +++ b/packages/block-library/src/button/style.scss @@ -36,10 +36,6 @@ $blocks-button__height: 56px; } } -.wp-gs .wp-block-button__link:not(.has-background) { - background-color: var(--wp--color--primary); -} - .is-style-squared .wp-block-button__link { border-radius: 0; } diff --git a/packages/interface/src/components/complementary-area/style.scss b/packages/interface/src/components/complementary-area/style.scss index 51284edf5769c..e2532042c103e 100644 --- a/packages/interface/src/components/complementary-area/style.scss +++ b/packages/interface/src/components/complementary-area/style.scss @@ -50,12 +50,24 @@ p { margin-top: 0; + line-height: 1.5; + color: $dark-gray-500; + background-color: inherit; + } + + h2 { + line-height: $default-line-height; + } + + h3 { + line-height: 1.5; } h2, h3 { font-size: $default-font-size; color: $dark-gray-500; + background-color: inherit; margin-bottom: 1.5em; }