Hide spacers and limit dividers height in form on mobile
[MAILPOET-3024]
This commit is contained in:
committed by
Veljko V
parent
f956c5e13e
commit
a6b8330968
@@ -389,6 +389,16 @@ div.mailpoet_form_slide_in.active {
|
||||
justify-content: center;
|
||||
margin-bottom: $form-block-margin;
|
||||
width: 100%;
|
||||
|
||||
@include breakpoint-max-width($form-break-small-width - 1) {
|
||||
&:not(.mailpoet_has_divider) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&.mailpoet_has_divider {
|
||||
max-height: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mailpoet_message {
|
||||
|
@@ -13,9 +13,16 @@ class Divider {
|
||||
];
|
||||
|
||||
public function render($block): string {
|
||||
$classes = isset($block['params']['class_name']) ? $block['params']['class_name'] : '';
|
||||
$classes = ['mailpoet_spacer'];
|
||||
if (isset($block['params']['type']) && $block['params']['type'] === 'divider') {
|
||||
$classes[] = 'mailpoet_has_divider';
|
||||
}
|
||||
if (!empty($block['params']['class_name'])) {
|
||||
$classes[] = $block['params']['class_name'];
|
||||
}
|
||||
$classAttr = join(' ', $classes);
|
||||
$height = $block['params']['height'] ?? self::DEFAULT_ATTRIBUTES['height'];
|
||||
return "<div class='mailpoet_spacer $classes' style='height: {$height}px;'>"
|
||||
return "<div class='{$classAttr}' style='height: {$height}px;'>"
|
||||
. $this->renderDivider($block)
|
||||
. '</div>';
|
||||
}
|
||||
|
@@ -62,7 +62,7 @@ class DividerTest extends \MailPoetUnitTest {
|
||||
|
||||
expect($result)->contains('height: 12px;');
|
||||
expect($result)->contains("class='mailpoet_divider");
|
||||
expect($result)->contains("class='mailpoet_spacer");
|
||||
expect($result)->contains("class='mailpoet_spacer mailpoet_has_divider");
|
||||
expect($result)->contains("border-top-style: dotted;");
|
||||
expect($result)->contains("border-top-width: 10px;");
|
||||
expect($result)->contains("border-top-color: red;");
|
||||
|
Reference in New Issue
Block a user