- Enables dynamic line-height based on font-size

lib/Newsletter/Renderer/Blocks/Footer.php

@@ -7,6 +7,9 @@ class Footer {
   static function render($element) {
     $element['text'] = preg_replace('/\n/', '<br /><br />', $element['text']);
     $element['text'] = preg_replace('/(<\/?p.*?>)/i', '', $element['text']);
+    $line_height = sprintf(
+      '%spx', StylesHelper::$line_height_multiplier * (int) $element['styles']['text']['fontSize']
+    );
     $DOM_parser = new \pQuery();
     $DOM = $DOM_parser->parseStr($element['text']);
     if(isset($element['styles']['link'])) {
@@ -25,7 +28,7 @@ class Footer {
     $template = '
       <tr>
         <td class="mailpoet_header_footer_padded mailpoet_footer" ' . $background_color . '
-        style="line-height: ' . StylesHelper::$line_height . ';' . StylesHelper::getBlockStyles($element) . StylesHelper::getStyles($element['styles'], 'text') . '">
+        style="line-height: ' . $line_height  . ';' . StylesHelper::getBlockStyles($element) . StylesHelper::getStyles($element['styles'], 'text') . '">
           ' . $DOM->html() . '
         </td>
       </tr>';

lib/Newsletter/Renderer/Blocks/Header.php

@@ -6,7 +6,10 @@ use MailPoet\Newsletter\Renderer\StylesHelper;
 class Header {
   static function render($element) {
     $element['text'] = preg_replace('/\n/', '<br /><br />', $element['text']);
-    $element['text'] = preg_replace('/(<\/?p.*?>)/', '', $element['text']);
+    $element['text'] = preg_replace('/(<\/?p.*?>)/i', '', $element['text']);
+    $line_height = sprintf(
+      '%spx', StylesHelper::$line_height_multiplier * (int) $element['styles']['text']['fontSize']
+    );
     $DOM_parser = new \pQuery();
     $DOM = $DOM_parser->parseStr($element['text']);
     if(isset($element['styles']['link'])) {
@@ -25,8 +28,8 @@ class Header {
     $template = '
       <tr>
         <td class="mailpoet_header_footer_padded mailpoet_header" ' . $background_color . '
-        style="' . StylesHelper::getBlockStyles($element) . StylesHelper::getStyles($element['styles'], 'text') . '">
+        style="line-height: ' . $line_height  . ';' . StylesHelper::getBlockStyles($element) . StylesHelper::getStyles($element['styles'], 'text') . '">
-        ' . $DOM->html() . '
+          ' . $DOM->html() . '
         </td>
       </tr>';
     return $template;

lib/Newsletter/Renderer/Blocks/Text.php

@@ -95,7 +95,7 @@ class Text {
       $line_breaks = ($next_element && preg_match('/<li>/i', $next_element->getInnerText())) ? '<br />' : $line_breaks;
       $paragraph->html('
         <tr>
-          <td class="mailpoet_paragraph" style="line-height:' . StylesHelper::$line_height . ';word-break:break-word;word-wrap:break-word;' . $style . '">
+          <td class="mailpoet_paragraph" style="word-break:break-word;word-wrap:break-word;' . $style . '">
             ' . $contents . $line_breaks . '
           </td>
          </tr>'
@@ -117,7 +117,7 @@ class Text {
         $list->class = 'mailpoet_paragraph';
         $list->style .= 'padding-top:0;padding-bottom:0;margin-top:10px;';
       }
-      $list->style .= 'margin-bottom:10px;line-height:' . StylesHelper::$line_height . ';';
+      $list->style .= 'margin-bottom:10px;';
     }
     return $DOM->__toString();
   }
@@ -128,7 +128,7 @@ class Text {
     $headings = $DOM->query('h1, h2, h3, h4');
     if(!$headings->count()) return $html;
     foreach($headings as $heading) {
-      $heading->style .= 'line-height:' . StylesHelper::$line_height . ';padding:0;font-style:normal;font-weight:normal;';
+      $heading->style .= 'padding:0;font-style:normal;font-weight:normal;';
     }
     return $DOM->__toString();
   }

lib/Newsletter/Renderer/StylesHelper.php

@@ -27,7 +27,8 @@ class StylesHelper {
     'Trebuchet MS' => "'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma, sans-serif",
     'Verdana' => 'Verdana, Geneva, sans-serif'
   );
-  static $line_height = 1.61803398875;
+  static $line_height_multiplier = 1.6;
+  static $heading_margin_multiplier = 0.3;
   static $padding_width = 20;
 
   static function getBlockStyles($element, $ignore_specific_styles = false) {
@@ -55,6 +56,7 @@ class StylesHelper {
   static function setStyle($style, $selector) {
     $css = $selector . '{' . PHP_EOL;
     $style = self::applyHeadingMargin($style, $selector);
+    $style = self::applyLineHeight($style, $selector);
     foreach($style as $attribute => $individual_style) {
       $individual_style = self::applyFontFamily($attribute, $individual_style);
       $css .= self::translateCSSAttribute($attribute) . ':' . $individual_style . ';' . PHP_EOL;
@@ -87,9 +89,16 @@ class StylesHelper {
   }
 
   static function applyHeadingMargin($style, $selector) {
-    if (!preg_match('/h[1|2|3|4]/i', $selector)) return $style;
+    if (!preg_match('/h[1-4]/i', $selector)) return $style;
     $font_size = (int) $style['fontSize'];
-    $style['margin'] = sprintf('0 0 %spx 0',  0.3 * $font_size);
+    $style['margin'] = sprintf('0 0 %spx 0', self::$heading_margin_multiplier * $font_size);
+    return $style;
+  }
+
+  static function applyLineHeight($style, $selector) {
+    if (!preg_match('/mailpoet_paragraph|h[1-4]/i', $selector)) return $style;
+    $font_size = (int) $style['fontSize'];
+    $style['lineHeight'] = sprintf('%spx', self::$line_height_multiplier * $font_size);
     return $style;
   }
 }

tests/unit/Newsletter/RendererTest.php

@@ -210,7 +210,7 @@ class NewsletterRendererTest extends MailPoetTest {
       ->contains('padding-top:0;padding-bottom:0;margin-top:10px;margin-bottom:10px;');
     // headings should be styled
     expect($DOM('tr > td.mailpoet_text > h1', 0)->attr('style'))
-      ->contains('margin:0 0 20px;padding:0;font-style:normal;font-weight:normal;');
+      ->contains('padding:0;font-style:normal;font-weight:normal;');
   }
 
   function testItRendersDivider() {