Skip to content

Commit 8cdb4f8

Browse files
TedGoasTedGoas
authored
Merge pull request #286 from matthieuSolente/main
adds to cerberus-hybrid.html
2 parents 6e032fb + 9aba7cf commit 8cdb4f8

File tree

1 file changed

+86
-74
lines changed

1 file changed

+86
-74
lines changed

‎cerberus-hybrid.html‎

Lines changed: 86 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -516,100 +516,112 @@ <h1 style="margin: 0 0 10px; font-size: 25px; line-height: 30px; color: #333333;
516516

517517
<!-- Thumbnail Left, Text Right : BEGIN -->
518518
<tr>
519-
<!-- dir=ltr is where the magic happens. This can be changed to dir=rtl to swap the alignment on wide while maintaining stack order on narrow. -->
520-
<td dir="ltr" height="100%" valign="top" width="100%" style="font-size:0; padding: 10px; background-color: #ffffff;" class="darkmode-bg">
521-
<!--[if mso]>
522-
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="660" style="width: 660px;">
523-
<tr>
524-
<td valign="top" width="220" style="width: 220px;">
525-
<![endif]-->
526-
<div style="display:inline-block; margin: 0 -1px; max-width: 220px; min-width:160px; vertical-align:top; width:100%;" class="stack-column">
527-
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
528-
<tr>
529-
<td dir="ltr" style="padding: 0 10px 10px 10px;">
530-
<img src="https://via.placeholder.com/200" width="200" height="" border="0" alt="alt_text" class="center-on-narrow" style="width: 100%; max-width: 200px; height: auto; background: #dddddd; font-family: sans-serif; font-size: 15px; line-height: 15px; color: #555555;">
519+
<td style="font-size:0; padding: 10px; text-align: left; background-color: #ffffff;" class="darkmode-bg">
520+
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
521+
<tr>
522+
<!-- dir=rtl is where the magic happens. This can be changed to dir=ltr to swap the alignment on wide while maintaining stack order on narrow. -->
523+
<td dir="ltr" height="100%" valign="top" width="100%">
524+
<!--[if mso]>
525+
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="660" style="width: 660px;">
526+
<tr>
527+
<td valign="top" width="220" style="width: 220px;">
528+
<![endif]-->
529+
<div style="display:inline-block; margin: 0 -1px; max-width: 220px; min-width:160px; vertical-align:top; width:100%;" class="stack-column">
530+
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
531+
<tr>
532+
<td dir="ltr" style="padding: 0 10px 10px 10px;">
533+
<img src="https://via.placeholder.com/200" width="200" height="" border="0" alt="alt_text" class="center-on-narrow" style="width: 100%; max-width: 200px; height: auto; background: #dddddd; font-family: sans-serif; font-size: 15px; line-height: 15px; color: #555555;">
534+
</td>
535+
</tr>
536+
</table>
537+
</div>
538+
<!--[if mso]>
531539
</td>
532-
</tr>
533-
</table>
534-
</div>
535-
<!--[if mso]>
536-
</td>
537-
<td valign="top" width="440" style="width: 440px;">
538-
<![endif]-->
539-
<div style="display:inline-block; margin: 0 -1px; max-width: 440px; min-width:280px; vertical-align:top;" class="stack-column">
540-
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
541-
<tr>
542-
<td dir="ltr" style="font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555; padding: 10px 10px 0; text-align: left;" class="center-on-narrow">
543-
<h2 style="margin: 0 0 10px 0; font-family: sans-serif; font-size: 18px; line-height: 22px; color: #333333; font-weight: bold;">Class aptent taciti sociosqu</h2>
544-
<p style="margin: 0 0 10px 0;">Maecenas sed ante pellentesque, posuere leo id, eleifend dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
545-
<!-- Button : BEGIN -->
546-
<table role="presentation" cellspacing="0" cellpadding="0" border="0" class="center-on-narrow" style="float:left;">
540+
<td valign="top" width="440" style="width: 440px;">
541+
<![endif]-->
542+
<div style="display:inline-block; margin: 0 -1px; max-width: 440px; min-width:280px; vertical-align:top;" class="stack-column">
543+
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
547544
<tr>
548-
<td class="button-td button-td-primary" style="border-radius: 4px; background: #222222;">
549-
<a class="button-a button-a-primary" href="https://google.com/" style="background: #222222; border: 1px solid #000000; font-family: sans-serif; font-size: 15px; line-height: 15px; text-decoration: none; padding: 13px 17px; color: #ffffff; display: block; border-radius: 4px;">Primary Button</a>
545+
<td dir="ltr" style="font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555; padding: 10px 10px 0; text-align: left;" class="center-on-narrow">
546+
<h2 style="margin: 0 0 10px 0; font-family: sans-serif; font-size: 18px; line-height: 22px; color: #333333; font-weight: bold;">Class aptent taciti sociosqu</h2>
547+
<p style="margin: 0 0 10px 0;">Maecenas sed ante pellentesque, posuere leo id, eleifend dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
548+
<!-- Button : BEGIN -->
549+
<table role="presentation" cellspacing="0" cellpadding="0" border="0" class="center-on-narrow" style="float:left;">
550+
<tr>
551+
<td class="button-td button-td-primary" style="border-radius: 4px; background: #222222;">
552+
<a class="button-a button-a-primary" href="https://google.com/" style="background: #222222; border: 1px solid #000000; font-family: sans-serif; font-size: 15px; line-height: 15px; text-decoration: none; padding: 13px 17px; color: #ffffff; display: block; border-radius: 4px;">Primary Button</a>
553+
</td>
554+
</tr>
555+
</table>
556+
<!-- Button : END -->
550557
</td>
551558
</tr>
552559
</table>
553-
<!-- Button : END -->
560+
</div>
561+
<!--[if mso]>
554562
</td>
555-
</tr>
556-
</table>
557-
</div>
558-
<!--[if mso]>
559-
</td>
560-
</tr>
563+
</tr>
564+
</table>
565+
<![endif]-->
566+
</td>
567+
</tr>
561568
</table>
562-
<![endif]-->
563569
</td>
564570
</tr>
565571
<!-- Thumbnail Left, Text Right : END -->
566572

567573
<!-- Thumbnail Right, Text Left : BEGIN -->
568574
<tr>
569-
<!-- dir=rtl is where the magic happens. This can be changed to dir=ltr to swap the alignment on wide while maintaining stack order on narrow. -->
570-
<td dir="rtl" height="100%" valign="top" width="100%" style="font-size:0; padding: 10px; text-align: left; background-color: #ffffff;" class="darkmode-bg">
571-
<!--[if mso]>
572-
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="660" style="width: 660px;">
573-
<tr>
574-
<td valign="top" width="220" style="width: 220px;">
575-
<![endif]-->
576-
<div style="display:inline-block; margin: 0 -1px; max-width: 220px; min-width:160px; vertical-align:top; width:100%;" class="stack-column">
577-
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
578-
<tr>
579-
<td dir="ltr" style="padding: 0 10px 10px 10px;">
580-
<img src="https://via.placeholder.com/200" width="200" height="" border="0" alt="alt_text" class="center-on-narrow" style="width: 100%; max-width: 200px; height: auto; background: #dddddd; font-family: sans-serif; font-size: 15px; line-height: 15px; color: #555555;">
575+
<td style="font-size:0; padding: 10px; text-align: left; background-color: #ffffff;" class="darkmode-bg">
576+
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
577+
<tr>
578+
<!-- dir=rtl is where the magic happens. This can be changed to dir=ltr to swap the alignment on wide while maintaining stack order on narrow. -->
579+
<td dir="rtl" height="100%" valign="top" width="100%">
580+
<!--[if mso]>
581+
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="660" style="width: 660px;">
582+
<tr>
583+
<td valign="top" width="220" style="width: 220px;">
584+
<![endif]-->
585+
<div style="display:inline-block; margin: 0 -1px; max-width: 220px; min-width:160px; vertical-align:top; width:100%;" class="stack-column">
586+
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
587+
<tr>
588+
<td dir="ltr" style="padding: 0 10px 10px 10px;">
589+
<img src="https://via.placeholder.com/200" width="200" height="" border="0" alt="alt_text" class="center-on-narrow" style="width: 100%; max-width: 200px; height: auto; background: #dddddd; font-family: sans-serif; font-size: 15px; line-height: 15px; color: #555555;">
590+
</td>
591+
</tr>
592+
</table>
593+
</div>
594+
<!--[if mso]>
581595
</td>
582-
</tr>
583-
</table>
584-
</div>
585-
<!--[if mso]>
586-
</td>
587-
<td valign="top" width="440" style="width: 440px;">
588-
<![endif]-->
589-
<div style="display:inline-block; margin: 0 -1px; max-width: 440px; min-width:280px; vertical-align:top;" class="stack-column">
590-
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
591-
<tr>
592-
<td dir="ltr" style="font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555; padding: 10px 10px 0; text-align: left;" class="center-on-narrow">
593-
<h2 style="margin: 0 0 10px 0; font-family: sans-serif; font-size: 18px; line-height: 22px; color: #333333; font-weight: bold;">Class aptent taciti sociosqu</h2>
594-
<p style="margin: 0 0 10px 0;">Maecenas sed ante pellentesque, posuere leo id, eleifend dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
595-
<!-- Button : BEGIN -->
596-
<table role="presentation" cellspacing="0" cellpadding="0" border="0" class="center-on-narrow" style="float:left;">
596+
<td valign="top" width="440" style="width: 440px;">
597+
<![endif]-->
598+
<div style="display:inline-block; margin: 0 -1px; max-width: 440px; min-width:280px; vertical-align:top;" class="stack-column">
599+
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
597600
<tr>
598-
<td class="button-td button-td-primary" style="border-radius: 4px; background: #222222;">
599-
<a class="button-a button-a-primary" href="https://google.com/" style="background: #222222; border: 1px solid #000000; font-family: sans-serif; font-size: 15px; line-height: 15px; text-decoration: none; padding: 13px 17px; color: #ffffff; display: block; border-radius: 4px;">Primary Button</a>
601+
<td dir="ltr" style="font-family: sans-serif; font-size: 15px; line-height: 20px; color: #555555; padding: 10px 10px 0; text-align: left;" class="center-on-narrow">
602+
<h2 style="margin: 0 0 10px 0; font-family: sans-serif; font-size: 18px; line-height: 22px; color: #333333; font-weight: bold;">Class aptent taciti sociosqu</h2>
603+
<p style="margin: 0 0 10px 0;">Maecenas sed ante pellentesque, posuere leo id, eleifend dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
604+
<!-- Button : BEGIN -->
605+
<table role="presentation" cellspacing="0" cellpadding="0" border="0" class="center-on-narrow" style="float:left;">
606+
<tr>
607+
<td class="button-td button-td-primary" style="border-radius: 4px; background: #222222;">
608+
<a class="button-a button-a-primary" href="https://google.com/" style="background: #222222; border: 1px solid #000000; font-family: sans-serif; font-size: 15px; line-height: 15px; text-decoration: none; padding: 13px 17px; color: #ffffff; display: block; border-radius: 4px;">Primary Button</a>
609+
</td>
610+
</tr>
611+
</table>
612+
<!-- Button : END -->
600613
</td>
601614
</tr>
602615
</table>
603-
<!-- Button : END -->
616+
</div>
617+
<!--[if mso]>
604618
</td>
605-
</tr>
606-
</table>
607-
</div>
608-
<!--[if mso]>
609-
</td>
610-
</tr>
619+
</tr>
620+
</table>
621+
<![endif]-->
622+
</td>
623+
</tr>
611624
</table>
612-
<![endif]-->
613625
</td>
614626
</tr>
615627
<!-- Thumbnail Right, Text Left : END -->

0 commit comments

Comments
 (0)