← All changes | templates/elements/skeleton-divider.php +46 -2 4.4.1 → 4.4.6 View file →

		@@ -1,8 +1,7 @@
1	1	<?php
2	2	defined( 'ABSPATH' ) || exit;
3	3	use YayMail\Utils\TemplateHelpers;
4		-use YayMail\Models\TemplateModel;
5	4
6	5	/**
7	6	* $args includes
8	7	* $element
		@@ -14,11 +13,56 @@
14	13	}
15	14
16	15	$element = $args['element'];
17	16
	17	+// Inline styles survive WooCommerce style_inline (Emogrifier) in email preview.
	18	+$container_style = 'background-color:#fff;padding:2.5rem 1rem;box-sizing:border-box;';
	19	+$skeleton_style = 'display:table;width:100%;';
	20	+$skeleton_mb_style = $skeleton_style . 'margin-bottom:10px;';
	21	+$content_style = 'display:table-cell;width:100%;vertical-align:top;';
	22	+$list_style = 'padding:0;margin:3px;list-style:none;';
	23	+$bar_li_base_style = 'height:15px;list-style:none;background:#f2f2f2;border-radius:100px;display:block;margin:0;padding:0;';
	24	+$image_li_style = 'width:100%;height:300px;list-style:none;background:#f2f2f2;border-radius:10px;display:block;margin:0;padding:0;';
	25	+
18	26	ob_start();
19	27	?>
20		-<div class="yaymail-skeleton-divider"><div class="yaymail-skeleton yaymail-skeleton-round css-dev-only-do-not-override-scpxro" style="margin-bottom: 10px;"><div class="yaymail-skeleton-content"><ul class="yaymail-skeleton-paragraph"><li style="width: 30%;"></li></ul></div></div><div class="yaymail-skeleton yaymail-skeleton-round yaymail-skeleton-divider__image css-dev-only-do-not-override-scpxro" style="margin-bottom: 10px;"><div class="yaymail-skeleton-content"><ul class="yaymail-skeleton-paragraph"><li style="width: 100%;"></li></ul></div></div><div class="yaymail-skeleton yaymail-skeleton-round css-dev-only-do-not-override-scpxro"><div class="yaymail-skeleton-content"><ul class="yaymail-skeleton-paragraph"><li style="width: 70%;"></li></ul></div></div><div class="yaymail-skeleton yaymail-skeleton-round css-dev-only-do-not-override-scpxro"><div class="yaymail-skeleton-content"><ul class="yaymail-skeleton-paragraph"><li style="width: 100%;"></li></ul></div></div><div class="yaymail-skeleton yaymail-skeleton-round css-dev-only-do-not-override-scpxro"><div class="yaymail-skeleton-content"><ul class="yaymail-skeleton-paragraph"><li style="width: 100%;"></li></ul></div></div></div>
	28	+<div class="yaymail-skeleton-divider" style="<?php echo esc_attr( $container_style ); ?>">
	29	+ <div class="yaymail-skeleton yaymail-skeleton-round" style="<?php echo esc_attr( $skeleton_mb_style ); ?>">
	30	+ <div class="yaymail-skeleton-content" style="<?php echo esc_attr( $content_style ); ?>">
	31	+ <ul class="yaymail-skeleton-paragraph" style="<?php echo esc_attr( $list_style ); ?>">
	32	+ <li style="<?php echo esc_attr( $bar_li_base_style . 'width:30%;' ); ?>"></li>
	33	+ </ul>
	34	+ </div>
	35	+ </div>
	36	+ <div class="yaymail-skeleton yaymail-skeleton-round yaymail-skeleton-divider__image" style="<?php echo esc_attr( $skeleton_mb_style ); ?>">
	37	+ <div class="yaymail-skeleton-content" style="<?php echo esc_attr( $content_style ); ?>">
	38	+ <ul class="yaymail-skeleton-paragraph" style="<?php echo esc_attr( $list_style ); ?>">
	39	+ <li style="<?php echo esc_attr( $image_li_style ); ?>"></li>
	40	+ </ul>
	41	+ </div>
	42	+ </div>
	43	+ <div class="yaymail-skeleton yaymail-skeleton-round" style="<?php echo esc_attr( $skeleton_style ); ?>">
	44	+ <div class="yaymail-skeleton-content" style="<?php echo esc_attr( $content_style ); ?>">
	45	+ <ul class="yaymail-skeleton-paragraph" style="<?php echo esc_attr( $list_style ); ?>">
	46	+ <li style="<?php echo esc_attr( $bar_li_base_style . 'width:70%;' ); ?>"></li>
	47	+ </ul>
	48	+ </div>
	49	+ </div>
	50	+ <div class="yaymail-skeleton yaymail-skeleton-round" style="<?php echo esc_attr( $skeleton_style ); ?>">
	51	+ <div class="yaymail-skeleton-content" style="<?php echo esc_attr( $content_style ); ?>">
	52	+ <ul class="yaymail-skeleton-paragraph" style="<?php echo esc_attr( $list_style ); ?>">
	53	+ <li style="<?php echo esc_attr( $bar_li_base_style . 'width:100%;' ); ?>"></li>
	54	+ </ul>
	55	+ </div>
	56	+ </div>
	57	+ <div class="yaymail-skeleton yaymail-skeleton-round" style="<?php echo esc_attr( $skeleton_style ); ?>">
	58	+ <div class="yaymail-skeleton-content" style="<?php echo esc_attr( $content_style ); ?>">
	59	+ <ul class="yaymail-skeleton-paragraph" style="<?php echo esc_attr( $list_style ); ?>">
	60	+ <li style="<?php echo esc_attr( $bar_li_base_style . 'width:100%;' ); ?>"></li>
	61	+ </ul>
	62	+ </div>
	63	+ </div>
	64	+</div>
21	65	<?php
22	66	$element_content = ob_get_clean();
23	67
24	68	TemplateHelpers::wrap_element_content( $element_content, $element );