diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md index 1e0ffa81c26dd4..207cb26ab01f3b 100644 --- a/docs/reference-guides/core-blocks.md +++ b/docs/reference-guides/core-blocks.md @@ -68,7 +68,7 @@ A calendar of your site’s posts. ([Source](https://github.com/WordPress/gutenb - **Name:** core/calendar - **Category:** widgets -- **Supports:** align, typography (fontSize, lineHeight) +- **Supports:** align, color (background, link, text), typography (fontSize, lineHeight) - **Attributes:** month, year ## Categories List diff --git a/packages/block-library/src/calendar/block.json b/packages/block-library/src/calendar/block.json index fad97e0a9efc74..2accd7142c7cc9 100644 --- a/packages/block-library/src/calendar/block.json +++ b/packages/block-library/src/calendar/block.json @@ -17,6 +17,15 @@ }, "supports": { "align": true, + "color": { + "link": true, + "__experimentalSkipSerialization": [ "text", "background" ], + "__experimentalDefaultControls": { + "background": true, + "text": true + }, + "__experimentalSelector": "table, th" + }, "typography": { "fontSize": true, "lineHeight": true, diff --git a/packages/block-library/src/calendar/index.php b/packages/block-library/src/calendar/index.php index 8f6226e943480c..01d2b7eb8ad91b 100644 --- a/packages/block-library/src/calendar/index.php +++ b/packages/block-library/src/calendar/index.php @@ -40,11 +40,32 @@ function render_block_core_calendar( $attributes ) { } } + $color_block_styles = array(); + + // Text color. + $preset_text_color = array_key_exists( 'textColor', $attributes ) ? "var:preset|color|{$attributes['textColor']}" : null; + $custom_text_color = _wp_array_get( $attributes, array( 'style', 'color', 'text' ), null ); + $color_block_styles['text'] = $preset_text_color ? $preset_text_color : $custom_text_color; + + // Background Color. + $preset_background_color = array_key_exists( 'backgroundColor', $attributes ) ? "var:preset|color|{$attributes['backgroundColor']}" : null; + $custom_background_color = _wp_array_get( $attributes, array( 'style', 'color', 'background' ), null ); + $color_block_styles['background'] = $preset_background_color ? $preset_background_color : $custom_background_color; + + // Generate color styles and classes. + $styles = gutenberg_style_engine_get_styles( array( 'color' => $color_block_styles ), array( 'convert_vars_to_classnames' => true ) ); + $inline_styles = empty( $styles['css'] ) ? '' : sprintf( ' style="%s"', esc_attr( $styles['css'] ) ); + $classnames = empty( $styles['classnames'] ) ? '' : ' ' . esc_attr( $styles['classnames'] ); + + // Apply color classes and styles to the calendar. + $calendar = str_replace( '