<mjml>
  <mj-head>
    <mj-title>Your order {{order.id}}</mj-title>
    <mj-preview>Thanks {{name}}, your order is on its way</mj-preview>
    <mj-attributes>
      <mj-all font-family="Helvetica, Arial, sans-serif" />
      <mj-text font-size="15px" line-height="22px" color="#222222" />
    </mj-attributes>
  </mj-head>
  <mj-body background-color="#f4f4f4">
    <mj-section background-color="#ffffff" padding="24px">
      <mj-column>
        <mj-text font-size="22px" font-weight="bold">Thanks, {{name}}!</mj-text>
        <mj-text>Order <b>{{order.id}}</b> has shipped and should arrive on {{order.arrives}}.</mj-text>
        <mj-table>
          {{{rows}}}
        </mj-table>
        <mj-button background-color="#1a73e8" href="{{order.url}}">Track your parcel</mj-button>
      </mj-column>
    </mj-section>
    <mj-section>
      <mj-column>
        <mj-text font-size="12px" color="#888888" align="center">Example Shop, 1 Market Street</mj-text>
      </mj-column>
    </mj-section>
  </mj-body>
</mjml>
