Cavemanon/piratepoet
8
Fork 0
Code Pull Requests Actions Releases 16 Activity

Fix padded ALC images breaking out of width on mobile [MAILPOET-1693]

Browse Source
This commit is contained in:
wxa
2018-12-17 18:06:16 +03:00
parent d363017ac2
commit c2955bdf35
3 changed files with 2 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
lib/Newsletter/Renderer/Blocks/Image.php
View File

@@ -22,9 +22,8 @@ class Image {
$element = self::adjustImageDimensions($element, $column_base_width); $element = self::adjustImageDimensions($element, $column_base_width);
} }
$max_width = is_numeric($element['width']) ? ($element['width'] . 'px') : '100%';
$image_template = ' $image_template = '
<img style="max-width:' . $max_width . ';" src="' . $element['src'] . '" <img src="' . $element['src'] . '"
width="' . $element['width'] . '" alt="' . $element['alt'] . '"/> width="' . $element['width'] . '" alt="' . $element['alt'] . '"/>
'; ';
if(!empty($element['link'])) { if(!empty($element['link'])) {

1
lib/Newsletter/Renderer/Template.html
View File

@@ -28,6 +28,7 @@
} }
.mailpoet_image img { .mailpoet_image img {
height: auto; height: auto;
max-width: 100%;
-ms-interpolation-mode: bicubic; -ms-interpolation-mode: bicubic;
border: 0; border: 0;
display: block; display: block;

4
tests/integration/Newsletter/RendererTest.php
View File

@@ -232,7 +232,6 @@ class RendererTest extends \MailPoetTest {
$DOM = $this->DOM_parser->parseStr(Image::render($template, self::COLUMN_BASE_WIDTH)); $DOM = $this->DOM_parser->parseStr(Image::render($template, self::COLUMN_BASE_WIDTH));
// element should be properly nested, it's width set and style applied // element should be properly nested, it's width set and style applied
expect($DOM('tr > td > img', 0)->attr('width'))->equals(620); expect($DOM('tr > td > img', 0)->attr('width'))->equals(620);
expect($DOM('tr > td > img', 0)->attr('style'))->notEmpty();
} }
function testItRendersAlignedImage() { function testItRendersAlignedImage() {
@@ -345,7 +344,6 @@ class RendererTest extends \MailPoetTest {
); );
$rendered_image = Image::render($image, self::COLUMN_BASE_WIDTH); $rendered_image = Image::render($image, self::COLUMN_BASE_WIDTH);
expect($rendered_image)->contains('width="auto"'); expect($rendered_image)->contains('width="auto"');
expect($rendered_image)->contains('max-width:100%');
} }
function testItAdjustImageDimensionsWithPx() { function testItAdjustImageDimensionsWithPx() {
@@ -359,7 +357,6 @@ class RendererTest extends \MailPoetTest {
); );
$rendered_image = Image::render($image, self::COLUMN_BASE_WIDTH); $rendered_image = Image::render($image, self::COLUMN_BASE_WIDTH);
expect($rendered_image)->contains('width="620"'); expect($rendered_image)->contains('width="620"');
expect($rendered_image)->contains('max-width:620px');
} }
function testItAdjustImageDimensionsWithoutPx() { function testItAdjustImageDimensionsWithoutPx() {
@@ -373,7 +370,6 @@ class RendererTest extends \MailPoetTest {
); );
$rendered_image = Image::render($image, self::COLUMN_BASE_WIDTH); $rendered_image = Image::render($image, self::COLUMN_BASE_WIDTH);
expect($rendered_image)->contains('width="620"'); expect($rendered_image)->contains('width="620"');
expect($rendered_image)->contains('max-width:620px');
} }
function testItRendersText() { function testItRendersText() {