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'])) {
$styles[] = "color:{$params['text_color']};";
}
if (isset($params['background_color'])) {
if (isset($params['background_color']) && !isset($params['gradient'])) {
$styles[] = "background-color:{$params['background_color']};";
}
if (isset($params['gradient'])) {
$styles[] = "background:{$params['gradient']};";
}
if (count($styles)) {
return ' style="' . implode('', $styles) . '"';
}
@ -26,7 +29,7 @@ class Columns {
if (!empty($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";
}
if (!empty($params['text_color'])) {

View File

@ -48,7 +48,7 @@ class ColumnsTest extends \MailPoetUnitTest {
expect($class->textContent)->contains('my-class');
}
public function testItShouldCustomBackground() {
public function testItShouldRenderCustomBackground() {
$block = $this->block;
$block['params']['background_color'] = '#ffffff';
$html = $this->columns->render($block, 'content');
@ -59,7 +59,7 @@ class ColumnsTest extends \MailPoetUnitTest {
expect($class->textContent)->contains('mailpoet_column_with_background');
}
public function testItShouldCustomTextColor() {
public function testItShouldRenderCustomTextColor() {
$block = $this->block;
$block['params']['text_color'] = '#ffffee';
$html = $this->columns->render($block, 'content');
@ -67,4 +67,15 @@ class ColumnsTest extends \MailPoetUnitTest {
$style = $this->htmlParser->getAttribute($columns, 'style');
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');
}
}