Fix renderer styles
This commit is contained in:
@ -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],
|
||||
);
|
||||
|
||||
|
@ -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'];
|
||||
|
@ -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 {
|
||||
'<table border="0" cellspacing="0" cellpadding="0" role="presentation" style="width:%1$s;">
|
||||
<tr>
|
||||
<td align="%2$s" valign="middle" role="presentation" class="%3$s" style="%4$s">
|
||||
<a class="%5$s" style="%6$s" href="%7$s" target="_blank">%8$s</a>
|
||||
<a class="button-link %5$s" style="%6$s" href="%7$s" target="_blank">%8$s</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>',
|
||||
|
Reference in New Issue
Block a user