From 364d587659a4b2b64a257d71eb5845dfc041e372 Mon Sep 17 00:00:00 2001
From: Rob Tull <rob@classyllama.com>
Date: Wed, 1 Jul 2015 14:32:32 -0500
Subject: [PATCH] MAGETWO-37843: All responsive email templates in Blank Theme

- Update styles for new order, invoice, shipment, and creditmemo email templates for guests
---
 .../frontend/email/creditmemo_new_guest.html  |  99 +++++++++--------
 .../frontend/email/invoice_new_guest.html     |  99 +++++++++--------
 .../view/frontend/email/order_new_guest.html  | 103 ++++++++++--------
 .../frontend/email/shipment_new_guest.html    | 102 +++++++++--------
 4 files changed, 228 insertions(+), 175 deletions(-)

diff --git a/app/code/Magento/Sales/view/frontend/email/creditmemo_new_guest.html b/app/code/Magento/Sales/view/frontend/email/creditmemo_new_guest.html
index bb9069b5314..ca829150908 100644
--- a/app/code/Magento/Sales/view/frontend/email/creditmemo_new_guest.html
+++ b/app/code/Magento/Sales/view/frontend/email/creditmemo_new_guest.html
@@ -23,53 +23,66 @@
 
 {{template config_path="design/email/header_template"}}
 
-<p class="greeting">{{trans "%name," name=$billing.getName()}}</p>
-<p>
-    {{trans "Thank you for your order from %store_name." store_name=$store.getFrontendName()}}
-    {{trans
-        'If you have any questions about your order please contact us at <a href="mailto:%support_email">%support_email</a> or call us at %store_phone.'
-
-        support_email=$store.getConfig('trans_email/ident_support/email')
-        store_phone=$store.getConfig('general/store_information/phone')
-    |raw}}
-</p>
-
-<h2>{{trans "Your Credit Memo #%creditmemo_id for Order #%order_id" creditmemo_id=$creditmemo.increment_id order_id=$order.increment_id}}</h2>
-
 <table>
-    <thead>
-    <tr>
-        <th>{{trans "Billing Information:"}}</th>
-        <th>{{trans "Payment Method:"}}</th>
-    </tr>
-    </thead>
-    <tbody>
-    <tr>
-        <td>{{var formattedBillingAddress|raw}}</td>
-        <td>{{var payment_html|raw}}</td>
-    </tr>
-    </tbody>
-</table>
-<br/>
+    <tr class="email-intro">
+        <td>
+            <p class="greeting">{{trans "%name," name=$billing.getName()}}</p>
+            <p>
+                {{trans "Thank you for your order from %store_name." store_name=$store.getFrontendName()}}
+                {{trans
+                    'If you have any questions about your order please contact us at <a href="mailto:%support_email">%support_email</a> or call us at %store_phone.'
 
-{{depend order.getIsNotVirtual()}}
-<table>
-    <thead>
-    <tr>
-        <th>{{trans "Shipping Information:"}}</th>
-        <th>{{trans "Shipping Method:"}}</th>
+                    support_email=$store.getConfig('trans_email/ident_support/email')
+                    store_phone=$store.getConfig('general/store_information/phone')
+                |raw}}
+            </p>
+        </td>
+    </tr>
+    <tr class="email-summary">
+        <td>
+            <h1>{{trans "Your Credit Memo #%creditmemo_id for Order #%order_id" creditmemo_id=$creditmemo.increment_id order_id=$order.incrh1ent_id}}</h1>
+        </td>
     </tr>
-    </thead>
-    <tbody>
-    <tr>
-        <td>{{var formattedShippingAddress|raw}}</td>
-        <td>{{var order.getShippingDescription()}}</td>
+    <tr class="email-information">
+        <td>
+            {{depend comment}}
+            <table class="message-info">
+                <tr>
+                    <td>
+                        {{var comment}}
+                    </td>
+                </tr>
+            </table>
+            {{/depend}}
+            <table class="order-details">
+                <tr>
+                    <td class="address-details">
+                        <h3>{{trans "Billing Info"}}</h3>
+                        <p>{{var formattedBillingAddress|raw}}</p>
+                    </td>
+                    {{depend order.getIsNotVirtual()}}
+                    <td class="address-details">
+                        <h3>{{trans "Shipping Info"}}</h3>
+                        <p>{{var formattedShippingAddress|raw}}</p>
+                    </td>
+                    {{/depend}}
+                </tr>
+                <tr>
+                    <td class="method-info">
+                        <h3>{{trans "Payment Method"}}</h3>
+                        {{var payment_html|raw}}
+                    </td>
+                    {{depend order.getIsNotVirtual()}}
+                    <td class="method-info">
+                        <h3>{{trans "Shipping Method"}}</h3>
+                        <p>{{var order.getShippingDescription()}}</p>
+                    </td>
+                    {{/depend}}
+                </tr>
+            </table>
+            {{layout handle="sales_email_order_creditmemo_items" creditmemo=$creditmemo order=$order}}
+        </td>
     </tr>
-    </tbody>
 </table>
-<br/>
-{{/depend}}
-{{layout handle="sales_email_order_creditmemo_items" creditmemo=$creditmemo order=$order}}
-<p>{{var comment}}</p>
 
 {{template config_path="design/email/footer_template"}}
diff --git a/app/code/Magento/Sales/view/frontend/email/invoice_new_guest.html b/app/code/Magento/Sales/view/frontend/email/invoice_new_guest.html
index 3d1aa35a1ab..5e82a1b1743 100644
--- a/app/code/Magento/Sales/view/frontend/email/invoice_new_guest.html
+++ b/app/code/Magento/Sales/view/frontend/email/invoice_new_guest.html
@@ -23,53 +23,66 @@
 
 {{template config_path="design/email/header_template"}}
 
-<p class="greeting">{{trans "%name," name=$billing.getName()}}</p>
-<p>
-    {{trans "Thank you for your order from %store_name." store_name=$store.getFrontendName()}}
-    {{trans
-        'If you have any questions about your order please contact us at <a href="mailto:%support_email">%support_email</a> or call us at %store_phone.'
-
-        support_email=$store.getConfig('trans_email/ident_support/email')
-        store_phone=$store.getConfig('general/store_information/phone')
-    |raw}}
-</p>
-
-<h2>{{trans "Your Invoice #%invoice_id for Order #%order_id" invoice_id=$invoice.increment_id order_id=$order.increment_id}}</h2>
-
 <table>
-    <thead>
-    <tr>
-        <th>{{trans "Billing Information:"}}</th>
-        <th>{{trans "Payment Method:"}}</th>
-    </tr>
-    </thead>
-    <tbody>
-    <tr>
-        <td>{{var formattedBillingAddress|raw}}</td>
-        <td>{{var payment_html|raw}}</td>
-    </tr>
-    </tbody>
-</table>
-<br/>
+    <tr class="email-intro">
+        <td>
+            <p class="greeting">{{trans "%name," name=$billing.getName()}}</p>
+            <p>
+                {{trans "Thank you for your order from %store_name." store_name=$store.getFrontendName()}}
+                {{trans
+                    'If you have any questions about your order please contact us at <a href="mailto:%support_email">%support_email</a> or call us at %store_phone.'
 
-{{depend order.getIsNotVirtual()}}
-<table>
-    <thead>
-    <tr>
-        <th>{{trans "Shipping Information:"}}</th>
-        <th>{{trans "Shipping Method:"}}</th>
+                    support_email=$store.getConfig('trans_email/ident_support/email')
+                    store_phone=$store.getConfig('general/store_information/phone')
+                |raw}}
+            </p>
+        </td>
+    </tr>
+    <tr class="email-summary">
+        <td>
+            <h1>{{trans "Your Invoice #%invoice_id for Order #%order_id" invoice_id=$invoice.increment_id order_id=$order.increment_id}}</h1>
+        </td>
     </tr>
-    </thead>
-    <tbody>
-    <tr>
-        <td>{{var formattedShippingAddress|raw}}</td>
-        <td>{{var order.getShippingDescription()}}</td>
+    <tr class="email-information">
+        <td>
+            {{depend comment}}
+            <table class="message-info">
+                <tr>
+                    <td>
+                        {{var comment}}
+                    </td>
+                </tr>
+            </table>
+            {{/depend}}
+            <table class="order-details">
+                <tr>
+                    <td class="address-details">
+                        <h3>{{trans "Billing Info"}}</h3>
+                        <p>{{var formattedBillingAddress|raw}}</p>
+                    </td>
+                    {{depend order.getIsNotVirtual()}}
+                    <td class="address-details">
+                        <h3>{{trans "Shipping Info"}}</h3>
+                        <p>{{var formattedShippingAddress|raw}}</p>
+                    </td>
+                    {{/depend}}
+                </tr>
+                <tr>
+                    <td class="method-info">
+                        <h3>{{trans "Payment Method"}}</h3>
+                        {{var payment_html|raw}}
+                    </td>
+                    {{depend order.getIsNotVirtual()}}
+                    <td class="method-info">
+                        <h3>{{trans "Shipping Method"}}</h3>
+                        <p>{{var order.getShippingDescription()}}</p>
+                    </td>
+                    {{/depend}}
+                </tr>
+            </table>
+            {{layout handle="sales_email_order_invoice_items" invoice=$invoice order=$order}}
+        </td>
     </tr>
-    </tbody>
 </table>
-<br/>
-{{/depend}}
-{{layout handle="sales_email_order_invoice_items" invoice=$invoice order=$order}}
-<p>{{var comment}}</p>
 
 {{template config_path="design/email/footer_template"}}
diff --git a/app/code/Magento/Sales/view/frontend/email/order_new_guest.html b/app/code/Magento/Sales/view/frontend/email/order_new_guest.html
index bf73d137481..03829c91c12 100644
--- a/app/code/Magento/Sales/view/frontend/email/order_new_guest.html
+++ b/app/code/Magento/Sales/view/frontend/email/order_new_guest.html
@@ -23,55 +23,68 @@
 
 {{template config_path="design/email/header_template"}}
 
-<p class="greeting">{{trans "%name," name=$order.getBillingAddress().getName()}}</p>
-<p>
-    {{trans "Thank you for your order from %store_name." store_name=$store.getFrontendName()}}
-    {{trans "Once your package ships we will send an email with a link to track your order."}}
-    {{trans
-        'If you have any questions about your order please contact us at <a href="mailto:%support_email">%support_email</a> or call us at %store_phone.'
-
-        support_email=$store.getConfig('trans_email/ident_support/email')
-        store_phone=$store.getConfig('general/store_information/phone')
-    |raw}}
-</p>
-<p>{{trans "Your order confirmation is below. Thank you again for your business."}}</p>
-
-<h2>{{trans "Your Order #%increment_id (placed on %created_at)" increment_id=$order.increment_id created_at=$order.getCreatedAtFormatted(1)}}<h2>
-
 <table>
-    <thead>
-    <tr>
-        <th>{{trans "Billing Information:"}}</th>
-        <th>{{trans "Payment Method:"}}</th>
-    </tr>
-    </thead>
-    <tbody>
-    <tr>
-        <td>{{var formattedBillingAddress|raw}}</td>
-        <td>{{var payment_html|raw}}</td>
-    </tr>
-    </tbody>
-</table>
-<br/>
+    <tr class="email-intro">
+        <td>
+            <p class="greeting">{{trans "%name," name=$order.getBillingAddress().getName()}}</p>
+            <p>
+                {{trans "Thank you for your order from %store_name." store_name=$store.getFrontendName()}}
+                {{trans "Once your package ships we will send an email with a link to track your order."}}
+                {{trans
+                    'If you have any questions about your order please contact us at <a href="mailto:%support_email">%support_email</a> or call us at %store_phone.'
 
-{{depend order.getIsNotVirtual()}}
-<table>
-    <thead>
-    <tr>
-        <th>{{trans "Shipping Information:"}}</th>
-        <th>{{trans "Shipping Method:"}}</th>
+                    support_email=$store.getConfig('trans_email/ident_support/email')
+                    store_phone=$store.getConfig('general/store_information/phone')
+                |raw}}
+            </p>
+            <p>{{trans "Your order confirmation is below. Thank you again for your business."}}</p>
+        </td>
+    </tr>
+    <tr class="email-summary">
+        <td>
+            <h1>{{trans "Your Order #%increment_id (placed on %created_at)" increment_id=$order.increment_id created_at=$order.getCreatedAtFormatted(1)}}</h1>
+        </td>
     </tr>
-    </thead>
-    <tbody>
-    <tr>
-        <td>{{var formattedShippingAddress|raw}}</td>
-        <td>{{var order.getShippingDescription()}}</td>
+    <tr class="email-information">
+        <td>
+            {{depend order.getEmailCustomerNote()}}
+            <table class="message-info">
+                <tr>
+                    <td>
+                        {{var order.getEmailCustomerNote()}}
+                    </td>
+                </tr>
+            </table>
+            {{/depend}}
+            <table class="order-details">
+                <tr>
+                    <td class="address-details">
+                        <h3>{{trans "Billing Info"}}</h3>
+                        <p>{{var formattedBillingAddress|raw}}</p>
+                    </td>
+                    {{depend order.getIsNotVirtual()}}
+                    <td class="address-details">
+                        <h3>{{trans "Shipping Info"}}</h3>
+                        <p>{{var formattedShippingAddress|raw}}</p>
+                    </td>
+                    {{/depend}}
+                </tr>
+                <tr>
+                    <td class="method-info">
+                        <h3>{{trans "Payment Method"}}</h3>
+                        {{var payment_html|raw}}
+                    </td>
+                    {{depend order.getIsNotVirtual()}}
+                    <td class="method-info">
+                        <h3>{{trans "Shipping Method"}}</h3>
+                        <p>{{var order.getShippingDescription()}}</p>
+                    </td>
+                    {{/depend}}
+                </tr>
+            </table>
+            {{layout handle="sales_email_order_items" order=$order}}
+        </td>
     </tr>
-    </tbody>
 </table>
-<br/>
-{{/depend}}
-{{layout handle="sales_email_order_items" order=$order}}
-<p>{{var order.getEmailCustomerNote()}}</p>
 
 {{template config_path="design/email/footer_template"}}
diff --git a/app/code/Magento/Sales/view/frontend/email/shipment_new_guest.html b/app/code/Magento/Sales/view/frontend/email/shipment_new_guest.html
index 50adfb99f06..bfd080cf9de 100644
--- a/app/code/Magento/Sales/view/frontend/email/shipment_new_guest.html
+++ b/app/code/Magento/Sales/view/frontend/email/shipment_new_guest.html
@@ -24,55 +24,69 @@
 
 {{template config_path="design/email/header_template"}}
 
-<p class="greeting">{{trans "%name," name=$billing.getName()}}</p>
-<p>
-    {{trans "Thank you for your order from %store_name." store_name=$store.getFrontendName()}}
-    {{trans
-        'If you have any questions about your order please contact us at <a href="mailto:%support_email">%support_email</a> or call us at %store_phone.'
-
-        support_email=$store.getConfig('trans_email/ident_support/email')
-        store_phone=$store.getConfig('general/store_information/phone')
-    |raw}}
-</p>
-<p>{{trans "Your shipping confirmation is below. Thank you again for your business."}}</p>
-
-<h2>{{trans "Your Shipment #%shipment_id for Order #%order_id" shipment_id=$shipment.increment_id order_id=$order.increment_id}}</h2>
-
 <table>
-    <thead>
-    <tr>
-        <th>{{trans "Billing Information:"}}</th>
-        <th>{{trans "Payment Method:"}}</th>
-    </tr>
-    </thead>
-    <tbody>
-    <tr>
-        <td>{{var formattedBillingAddress|raw}}</td>
-        <td>{{var payment_html|raw}}</td>
+    <tr class="email-intro">
+        <td>
+            <p class="greeting">{{trans "%name," name=$billing.getName()}}</p>
+            <p>
+                {{trans "Thank you for your order from %store_name." store_name=$store.getFrontendName()}}
+                {{trans
+                    'If you have any questions about your order please contact us at <a href="mailto:%support_email">%support_email</a> or call us at %store_phone.'
+
+                    support_email=$store.getConfig('trans_email/ident_support/email')
+                    store_phone=$store.getConfig('general/store_information/phone')
+                |raw}}
+            </p>
+        </td>
     </tr>
-    </tbody>
-</table>
-<br/>
+    <tr class="email-summary">
+        <td>
+            <p>{{trans "Your shipping confirmation is below. Thank you again for your business."}}</p>
 
-{{depend order.getIsNotVirtual()}}
-<table>
-    <thead>
-    <tr>
-        <th>{{trans "Shipping Information:"}}</th>
-        <th>{{trans "Shipping Method:"}}</th>
+            <h1>{{trans "Your Shipment #%shipment_id for Order #%order_id" shipment_id=$shipment.increment_id order_id=$order.increment_id}}</h1>
+        </td>
     </tr>
-    </thead>
-    <tbody>
-    <tr>
-        <td>{{var formattedShippingAddress|raw}}</td>
-        <td>{{var order.getShippingDescription()}}</td>
+    <tr class="email-information">
+        <td>
+            {{depend comment}}
+            <table class="message-info">
+                <tr>
+                    <td>
+                        {{var comment}}
+                    </td>
+                </tr>
+            </table>
+            {{/depend}}
+            <table class="order-details">
+                <tr>
+                    <td class="address-details">
+                        <h3>{{trans "Billing Info"}}</h3>
+                        <p>{{var formattedBillingAddress|raw}}</p>
+                    </td>
+                    {{depend order.getIsNotVirtual()}}
+                    <td class="address-details">
+                        <h3>{{trans "Shipping Info"}}</h3>
+                        <p>{{var formattedShippingAddress|raw}}</p>
+                    </td>
+                    {{/depend}}
+                </tr>
+                <tr>
+                    <td class="method-info">
+                        <h3>{{trans "Payment Method"}}</h3>
+                        {{var payment_html|raw}}
+                    </td>
+                    {{depend order.getIsNotVirtual()}}
+                    <td class="method-info">
+                        <h3>{{trans "Shipping Method"}}</h3>
+                        <p>{{var order.getShippingDescription()}}</p>
+                    </td>
+                    {{/depend}}
+                </tr>
+            </table>
+            {{layout handle="sales_email_order_shipment_items" shipment=$shipment order=$order}}
+            {{block class='Magento\\Framework\\View\\Element\\Template' area='frontend' template='Magento_Sales::email/shipment/track.phtml' shipment=$shipment order=$order}}
+        </td>
     </tr>
-    </tbody>
 </table>
-<br/>
-{{/depend}}
-{{layout handle="sales_email_order_shipment_items" shipment=$shipment order=$order}}
-{{block class='Magento\\Framework\\View\\Element\\Template' area='frontend' template='Magento_Sales::email/shipment/track.phtml' shipment=$shipment order=$order}}
-<p>{{var comment}}</p>
 
 {{template config_path="design/email/footer_template"}}
-- 
GitLab