diff --git a/mailpoet/assets/js/src/email-editor/engine/hooks/use-email-css.ts b/mailpoet/assets/js/src/email-editor/engine/hooks/use-email-css.ts index 9b7e5f329f..0a2ab821ab 100644 --- a/mailpoet/assets/js/src/email-editor/engine/hooks/use-email-css.ts +++ b/mailpoet/assets/js/src/email-editor/engine/hooks/use-email-css.ts @@ -1,6 +1,6 @@ import { useMemo } from '@wordpress/element'; import { useSelect } from '@wordpress/data'; -import { merge } from 'lodash'; +import deepmerge from 'deepmerge'; import { // @ts-expect-error No types for this exist yet. privateApis as blockEditorPrivateApi, @@ -21,7 +21,12 @@ export function useEmailCss() { ); const mergedConfig = useMemo( - () => merge({}, editorTheme, templateTheme) as EmailStyles, + () => + deepmerge.all([ + {}, + editorTheme || {}, + templateTheme || {}, + ]) as EmailStyles, [editorTheme, templateTheme], ); diff --git a/mailpoet/lib/EmailEditor/Engine/ThemeController.php b/mailpoet/lib/EmailEditor/Engine/ThemeController.php index d2a6747e48..c0ad8c7447 100644 --- a/mailpoet/lib/EmailEditor/Engine/ThemeController.php +++ b/mailpoet/lib/EmailEditor/Engine/ThemeController.php @@ -170,17 +170,21 @@ class ThemeController { foreach ($elementsStyles as $key => $elementsStyle) { $selector = $key; - if ($key === 'heading') { - $selector = 'h1, h2, h3, h4, h5, h6'; - } - - if ($key === 'link') { - // Target direct decendants of blocks to avoid styling buttons. :not() is not supported by the inliner. - $selector = 'p > a, div > a, li > a'; - } - if ($key === 'button') { $selector = '.wp-block-button'; + $cssElements .= wp_style_engine_get_styles($elementsStyle, ['selector' => '.wp-block-button'])['css']; + // Add color to link element. + $cssElements .= wp_style_engine_get_styles(['color' => ['text' => $elementsStyle['color']['text'] ?? '']], ['selector' => '.wp-block-button a'])['css']; + continue; + } + + switch ($key) { + case 'heading': + $selector = 'h1, h2, h3, h4, h5, h6'; + break; + case 'link': + $selector = 'a:not(.button-link)'; + break; } $cssElements .= wp_style_engine_get_styles($elementsStyle, ['selector' => $selector])['css']; diff --git a/mailpoet/lib/EmailEditor/Integrations/Core/Renderer/Blocks/Button.php b/mailpoet/lib/EmailEditor/Integrations/Core/Renderer/Blocks/Button.php index b83e129579..919ee6f16e 100644 --- a/mailpoet/lib/EmailEditor/Integrations/Core/Renderer/Blocks/Button.php +++ b/mailpoet/lib/EmailEditor/Integrations/Core/Renderer/Blocks/Button.php @@ -33,12 +33,15 @@ class Button extends AbstractBlockRenderer { ]; } + public function render(string $blockContent, array $parsedBlock, SettingsController $settingsController): string { + return $this->renderContent($blockContent, $parsedBlock, $settingsController); + } + protected function renderContent($blockContent, array $parsedBlock, SettingsController $settingsController): string { if (empty($parsedBlock['innerHTML'])) { return ''; } - $themeData = $settingsController->getTheme()->get_data(); $domHelper = new DomDocumentHelper($parsedBlock['innerHTML']); $blockClassname = $domHelper->getAttributeValueByTagName('div', 'class') ?? ''; $buttonLink = $domHelper->findElement('a'); @@ -59,7 +62,6 @@ class Button extends AbstractBlockRenderer { ]); $blockStyles = array_replace_recursive( - $themeData['styles']['blocks']['core/button'] ?? [], [ 'color' => array_filter([ 'background' => $blockAttributes['backgroundColor'] ? $settingsController->translateSlugToColor($blockAttributes['backgroundColor']) : null, @@ -80,7 +82,7 @@ class Button extends AbstractBlockRenderer { '
- %8$s + %8$s |