Update from front end rendering to support font sizes with units

[MAILPOET-5139]
This commit is contained in:
Rostislav Wolny
2023-03-20 13:10:50 +01:00
committed by Aschepikov
parent ce41438d65
commit 274a77ea92
8 changed files with 51 additions and 6 deletions

View File

@@ -188,8 +188,8 @@ class BlockRendererHelper {
public function renderFontStyle(array $formSettings, array $styles = []) {
$rules = [];
if (isset($formSettings['fontSize'])) {
$rules[] = 'font-size: ' . trim($formSettings['fontSize']) . 'px;';
$rules[] = 'line-height: ' . (float)trim($formSettings['fontSize']) * 1.2 . 'px";';
$rules[] = 'font-size: ' . $formSettings['fontSize'] . (is_numeric($formSettings['fontSize']) ? "px;" : ";");
$rules[] = 'line-height: 1.2;';
}
if (isset($styles['bold'])) {
$rules[] = 'font-weight: bold;';

View File

@@ -93,7 +93,7 @@ class Heading {
$styles[] = 'color: ' . $block['params']['text_color'];
}
if (!empty($block['params']['font_size'])) {
$styles[] = 'font-size: ' . $block['params']['font_size'] . 'px';
$styles[] = 'font-size: ' . $block['params']['font_size'] . (is_numeric($block['params']['font_size']) ? 'px' : '');
}
if (!empty($block['params']['line_height'])) {
$styles[] = 'line-height: ' . $block['params']['line_height'];

View File

@@ -78,7 +78,7 @@ class Paragraph {
$styles[] = 'color: ' . $block['params']['text_color'];
}
if (!empty($block['params']['font_size'])) {
$styles[] = 'font-size: ' . $block['params']['font_size'] . 'px';
$styles[] = 'font-size: ' . $block['params']['font_size'] . (is_numeric($block['params']['font_size']) ? 'px' : '');
}
if (!empty($block['params']['line_height'])) {
$styles[] = 'line-height: ' . $block['params']['line_height'];

View File

@@ -48,10 +48,10 @@ class BlockStylesRenderer {
$rules[] = "font-family:'{$formSettings['font_family']}';" ;
}
if (isset($styles['font_size'])) {
$rules[] = "font-size:" . intval($styles['font_size']) . "px;";
$rules[] = "font-size:" . $styles['font_size'] . (is_numeric($styles['font_size']) ? "px;" : ";");
}
if (isset($formSettings['fontSize']) && !isset($styles['font_size'])) {
$rules[] = "font-size:" . intval($formSettings['fontSize']) . "px;";
$rules[] = "font-size:" . $formSettings['fontSize'] . (is_numeric($formSettings['fontSize']) ? "px;" : ";");
}
if (isset($formSettings['fontSize']) || isset($styles['font_size'])) {
$rules[] = "line-height:1.5;";

View File

@@ -58,6 +58,12 @@ class BlockRendererHelperTest extends \MailPoetUnitTest {
$block['params']['hide_label'] = '1';
$label = $this->rendererHelper->renderLabel($block, []);
expect($label)->equals('');
$label = $this->rendererHelper->renderLabel($this->block, ['fontSize' => 10]);
expect($label)->stringContainsString('style="font-size: 10px;');
$label = $this->rendererHelper->renderLabel($this->block, ['fontSize' => '1.2em']);
expect($label)->stringContainsString('style="font-size: 1.2em;');
}
public function testItShouldRenderLegend() {

View File

@@ -105,6 +105,16 @@ class HeadingTest extends \MailPoetUnitTest {
expect($html)->equals('<h2 class="mailpoet-heading mailpoet-has-font-size" style="font-size: 33px">Header</h2>');
}
public function testItShouldRenderFontSizeWithUnit() {
$html = $this->heading->render([
'params' => [
'content' => 'Header',
'font_size' => '2.2em',
],
]);
expect($html)->equals('<h2 class="mailpoet-heading mailpoet-has-font-size" style="font-size: 2.2em">Header</h2>');
}
public function testItShouldRenderLineHeight() {
$html = $this->heading->render([
'params' => [

View File

@@ -80,6 +80,16 @@ class ParagraphTest extends \MailPoetUnitTest {
expect($html)->equals('<p class="mailpoet_form_paragraph mailpoet-has-font-size" style="font-size: 33px">Paragraph</p>');
}
public function testItShouldRenderFontSizeWithUnit() {
$html = $this->paragraph->render([
'params' => [
'content' => 'Paragraph',
'font_size' => '2.3em',
],
]);
expect($html)->equals('<p class="mailpoet_form_paragraph mailpoet-has-font-size" style="font-size: 2.3em">Paragraph</p>');
}
public function testItShouldRenderLineHeight() {
$html = $this->paragraph->render([
'params' => [

View File

@@ -123,4 +123,23 @@ class BlockStylesRendererTest extends \MailPoetUnitTest {
$result = $this->renderer->renderForButton(['font_family' => 'font2'], $settings);
expect($result)->stringContainsString("font-family:'font2'");
}
public function testItShouldSupportFontSizesWithUnits() {
$settings = [
'input_padding' => '40',
'fontSize' => '1.5rem',
];
$result = $this->renderer->renderForButton([], $settings);
expect($result)->stringContainsString('font-size:1.5rem;');
$styles = [
'font_size' => '2.4em',
];
$result = $this->renderer->renderForButton($styles, $settings);
expect($result)->stringContainsString('font-size:2.4em;');
$styles = [
'font_size' => '23',
];
$result = $this->renderer->renderForButton($styles, $settings);
expect($result)->stringContainsString('font-size:23px;');
}
}