Add gradient rendering to columns on front end

[MAILPOET-3005]
This commit is contained in:
Rostislav Wolny
2020-07-02 16:14:48 +02:00
committed by Veljko V
parent 3eb6513b0a
commit 4d1fbcd157
2 changed files with 18 additions and 4 deletions

View File

@ -12,9 +12,12 @@ class Columns {
if (isset($params['text_color'])) { if (isset($params['text_color'])) {
$styles[] = "color:{$params['text_color']};"; $styles[] = "color:{$params['text_color']};";
} }
if (isset($params['background_color'])) { if (isset($params['background_color']) && !isset($params['gradient'])) {
$styles[] = "background-color:{$params['background_color']};"; $styles[] = "background-color:{$params['background_color']};";
} }
if (isset($params['gradient'])) {
$styles[] = "background:{$params['gradient']};";
}
if (count($styles)) { if (count($styles)) {
return ' style="' . implode('', $styles) . '"'; return ' style="' . implode('', $styles) . '"';
} }
@ -26,7 +29,7 @@ class Columns {
if (!empty($params['vertical_alignment'])) { if (!empty($params['vertical_alignment'])) {
$classes[] = "mailpoet_vertically_align_{$params['vertical_alignment']}"; $classes[] = "mailpoet_vertically_align_{$params['vertical_alignment']}";
} }
if (!empty($params['background_color'])) { if (!empty($params['background_color']) || !empty($params['gradient'])) {
$classes[] = "mailpoet_column_with_background"; $classes[] = "mailpoet_column_with_background";
} }
if (!empty($params['text_color'])) { if (!empty($params['text_color'])) {

View File

@ -48,7 +48,7 @@ class ColumnsTest extends \MailPoetUnitTest {
expect($class->textContent)->contains('my-class'); expect($class->textContent)->contains('my-class');
} }
public function testItShouldCustomBackground() { public function testItShouldRenderCustomBackground() {
$block = $this->block; $block = $this->block;
$block['params']['background_color'] = '#ffffff'; $block['params']['background_color'] = '#ffffff';
$html = $this->columns->render($block, 'content'); $html = $this->columns->render($block, 'content');
@ -59,7 +59,7 @@ class ColumnsTest extends \MailPoetUnitTest {
expect($class->textContent)->contains('mailpoet_column_with_background'); expect($class->textContent)->contains('mailpoet_column_with_background');
} }
public function testItShouldCustomTextColor() { public function testItShouldRenderCustomTextColor() {
$block = $this->block; $block = $this->block;
$block['params']['text_color'] = '#ffffee'; $block['params']['text_color'] = '#ffffee';
$html = $this->columns->render($block, 'content'); $html = $this->columns->render($block, 'content');
@ -67,4 +67,15 @@ class ColumnsTest extends \MailPoetUnitTest {
$style = $this->htmlParser->getAttribute($columns, 'style'); $style = $this->htmlParser->getAttribute($columns, 'style');
expect($style->textContent)->contains('color:#ffffee;'); expect($style->textContent)->contains('color:#ffffee;');
} }
public function testItShouldGradientBackground() {
$block = $this->block;
$block['params']['gradient'] = 'linear-gradient(red, yellow)';
$html = $this->columns->render($block, 'content');
$columns = $this->htmlParser->getElementByXpath($html, '//div[1]');
$style = $this->htmlParser->getAttribute($columns, 'style');
expect($style->textContent)->contains('background:linear-gradient(red, yellow);');
$class = $this->htmlParser->getAttribute($columns, 'class');
expect($class->textContent)->contains('mailpoet_column_with_background');
}
} }