spree_core 4.10.1 → 5.0.0.rc1

data/app/views/spree/shared/_base_mailer_stylesheets.html.erb

@@ -0,0 +1,456 @@
+<style type="text/css" rel="stylesheet" media="all">
+  /* Base ------------------------------ */
+
+  @import url("https://fonts.googleapis.com/css?family=Nunito+Sans:400,700&display=swap");
+
+  body {
+    width: 100% !important;
+    height: 100%;
+    margin: 0;
+    -webkit-text-size-adjust: none;
+  }
+
+  a {
+    color: #3869D4;
+  }
+
+  a img {
+    border: none;
+  }
+
+  td {
+    word-break: break-word;
+  }
+
+  .preheader {
+    display: none !important;
+    visibility: hidden;
+    mso-hide: all;
+    font-size: 1px;
+    line-height: 1px;
+    max-height: 0;
+    max-width: 0;
+    opacity: 0;
+    overflow: hidden;
+  }
+
+  /* Type ------------------------------ */
+
+  body,
+  td,
+  th {
+    font-family: "Nunito Sans", Helvetica, Arial, sans-serif;
+  }
+
+  h1 {
+    margin-top: 0;
+    color: #333333;
+    font-size: 22px;
+    font-weight: bold;
+    text-align: left;
+  }
+
+  h2 {
+    margin-top: 0;
+    color: #333333;
+    font-size: 16px;
+    font-weight: bold;
+    text-align: left;
+  }
+
+  h3 {
+    margin-top: 0;
+    color: #333333;
+    font-size: 14px;
+    font-weight: bold;
+    text-align: left;
+  }
+
+  td,
+  th {
+    font-size: 16px;
+  }
+
+  p,
+  ul,
+  ol,
+  blockquote {
+    margin: .4em 0 1.1875em;
+    font-size: 16px;
+    line-height: 1.625;
+  }
+
+  p.sub {
+    font-size: 13px;
+  }
+
+  /* Utilities ------------------------------ */
+
+  .align-right {
+    text-align: right;
+  }
+
+  .align-left {
+    text-align: left;
+  }
+
+  .align-center {
+    text-align: center;
+  }
+
+  /* Buttons ------------------------------ */
+
+  .button {
+    background-color: #3869D4;
+    border-top: 10px solid #3869D4;
+    border-right: 18px solid #3869D4;
+    border-bottom: 10px solid #3869D4;
+    border-left: 18px solid #3869D4;
+    display: inline-block;
+    color: #FFF !important;
+    text-decoration: none;
+    border-radius: 3px;
+    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.16);
+    -webkit-text-size-adjust: none;
+    box-sizing: border-box;
+  }
+
+  .button--green {
+    background-color: #22BC66;
+    border-top: 10px solid #22BC66;
+    border-right: 18px solid #22BC66;
+    border-bottom: 10px solid #22BC66;
+    border-left: 18px solid #22BC66;
+  }
+
+  .button--red {
+    background-color: #FF6136;
+    border-top: 10px solid #FF6136;
+    border-right: 18px solid #FF6136;
+    border-bottom: 10px solid #FF6136;
+    border-left: 18px solid #FF6136;
+  }
+
+  @media only screen and (max-width: 500px) {
+    .button {
+      width: 100% !important;
+      text-align: center !important;
+    }
+  }
+
+  /* Attribute list ------------------------------ */
+
+  .attributes {
+    margin: 0 0 21px;
+  }
+
+  .attributes_content {
+    background-color: #F4F4F7;
+    padding: 16px;
+  }
+
+  .attributes_item {
+    padding: 0;
+  }
+
+  /* Related Items ------------------------------ */
+
+  .related {
+    width: 100%;
+    margin: 0;
+    padding: 25px 0 0 0;
+    -premailer-width: 100%;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+  }
+
+  .related_item {
+    padding: 10px 0;
+    color: #CBCCCF;
+    font-size: 15px;
+    line-height: 18px;
+  }
+
+  .related_item-title {
+    display: block;
+    margin: .5em 0 0;
+  }
+
+  .related_item-thumb {
+    display: block;
+    padding-bottom: 10px;
+  }
+
+  .related_heading {
+    border-top: 1px solid #CBCCCF;
+    text-align: center;
+    padding: 25px 0 10px;
+  }
+
+  /* Discount Code ------------------------------ */
+
+  .discount {
+    width: 100%;
+    margin: 0;
+    padding: 24px;
+    -premailer-width: 100%;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+    background-color: #F4F4F7;
+    border: 2px dashed #CBCCCF;
+  }
+
+  .discount_heading {
+    text-align: center;
+  }
+
+  .discount_body {
+    text-align: center;
+    font-size: 15px;
+  }
+
+  /* Social Icons ------------------------------ */
+
+  .social {
+    width: auto;
+  }
+
+  .social td {
+    padding: 0;
+    width: auto;
+  }
+
+  .social_icon {
+    height: 20px;
+    margin: 0 8px 10px 8px;
+    padding: 0;
+  }
+
+  /* Data table ------------------------------ */
+
+  .purchase {
+    width: 100%;
+    margin: 0;
+    -premailer-width: 100%;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+  }
+
+  .purchase_content {
+    width: 100%;
+    margin: 0;
+    -premailer-width: 100%;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+  }
+
+  .purchase_item {
+    padding: 10px 4px;
+    color: #51545E;
+    font-size: 15px;
+    line-height: 18px;
+  }
+
+  .purchase_image {
+    padding: 5px;
+  }
+
+  .purchase_item p {
+    margin: 0;
+    padding: 0.1em 0;
+  }
+
+  .purchase_item--additional {
+    font-size: 12px;
+  }
+
+  .purchase_heading {
+    padding-bottom: 8px;
+    border-bottom: 1px solid #EAEAEC;
+  }
+
+  .purchase_heading p {
+    margin: 0;
+    color: #85878E;
+    font-size: 12px;
+  }
+
+  .purchase_footer {
+    padding-top: 15px;
+    border-top: 1px solid #EAEAEC;
+  }
+
+  .purchase_total {
+    margin: 0;
+    text-align: right;
+    font-weight: bold;
+    color: #333333;
+  }
+
+  .purchase_total--name {
+    margin: 0;
+    text-align: right;
+    color: #333333;
+  }
+
+  .purchase_total--label {
+    padding: 0 15px 0 0;
+  }
+
+  .purchase_total-col {
+    vertical-align: bottom;
+  }
+
+  body {
+    background-color: #F2F4F6;
+    color: #51545E;
+  }
+
+  p {
+    color: #51545E;
+  }
+
+  .email-wrapper {
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    -premailer-width: 100%;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+    background-color: #F2F4F6;
+  }
+
+  .email-content {
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    -premailer-width: 100%;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+  }
+
+  /* Masthead ----------------------- */
+
+  .email-masthead {
+    padding: 25px 0;
+    text-align: center;
+  }
+
+  .email-masthead_logo {
+    width: 94px;
+  }
+
+  .email-masthead_name {
+    font-size: 16px;
+    font-weight: bold;
+    color: #A8AAAF;
+    text-decoration: none;
+    text-shadow: 0 1px 0 white;
+  }
+
+  /* Body ------------------------------ */
+
+  .email-body {
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    -premailer-width: 100%;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+  }
+
+  .email-body_inner {
+    width: 570px;
+    margin: 0 auto;
+    padding: 0;
+    -premailer-width: 570px;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+    background-color: #FFFFFF;
+  }
+
+  .email-footer {
+    width: 570px;
+    margin: 0 auto;
+    padding: 0;
+    -premailer-width: 570px;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+    text-align: center;
+  }
+
+  .email-footer p {
+    color: #A8AAAF;
+  }
+
+  .body-action {
+    width: 100%;
+    margin: 30px auto;
+    padding: 0;
+    -premailer-width: 100%;
+    -premailer-cellpadding: 0;
+    -premailer-cellspacing: 0;
+    text-align: center;
+  }
+
+  .body-sub {
+    margin-top: 25px;
+    padding-top: 25px;
+    border-top: 1px solid #EAEAEC;
+  }
+
+  .content-cell {
+    padding: 40px;
+  }
+
+  /*Media Queries ------------------------------ */
+
+  @media only screen and (max-width: 600px) {
+    .email-body_inner,
+    .email-footer {
+      width: 100% !important;
+    }
+    .content-cell {
+      padding: 40px 15px !important;
+    }
+  }
+
+  @media (prefers-color-scheme: dark) {
+    body,
+    .email-body,
+    .email-body_inner,
+    .email-content,
+    .email-wrapper,
+    .email-masthead,
+    .email-footer {
+      background-color: #333333 !important;
+      color: #FFF !important;
+    }
+
+    p,
+    ul,
+    ol,
+    blockquote,
+    h1,
+    h2,
+    h3 {
+      color: #FFF !important;
+    }
+
+    .attributes_content,
+    .discount {
+      background-color: #222 !important;
+    }
+
+    .email-masthead_name {
+      text-shadow: none !important;
+    }
+  }
+</style>
+<!--[if mso]>
+<style type="text/css">
+  .f-fallback {
+    font-family: Arial, sans-serif;
+  }
+</style>
+<![endif]-->

data/app/views/spree/shared/_google_places_api_loader.html.erb

@@ -0,0 +1,7 @@
+<% if Spree.google_places_api_key.present? %>
+  <script>
+    (g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})({
+      key: "<%= Spree.google_places_api_key %>",
+    });
+  </script>
+<% end %>

data/app/views/spree/shared/_mailer_line_item.html.erb

@@ -0,0 +1,12 @@
+<tr>
+  <td class="six sub-columns">
+    <strong>
+      <%= link_to raw(line_item.variant.product.name), spree_storefront_resource_url(line_item.variant.product) %>
+    </strong>
+    <%= raw(line_item.variant.options_text) -%>
+    (<%= line_item.variant.sku %>)
+  </td>
+  <td class="six sub-columns last right">
+    <%= line_item.quantity %> x <%= line_item.single_money %> = <%= line_item.display_amount %>
+  </td>
+</tr>

data/app/views/spree/shared/_mailer_logo.html.erb

@@ -0,0 +1,41 @@
+<% logo ||= current_store.mailer_logo.attached? ? current_store.mailer_logo : current_store.logo %>
+<% height ||= 64 %>
+<% logo_css ||= '' %>
+
+<%= link_to current_store.url_or_custom_domain, id: 'site-logo', style: "text-decoration: none;" do %>
+  <span style="display: none;"><%= current_store.name %></span>
+  <% if logo.present? && logo.attached? && logo.variable? %>
+    <% aspect_ratio = as_aspect_ratio(logo) %>
+    <% logo_style = "aspect-ratio: #{aspect_ratio};" %>
+
+    <% if aspect_ratio.to_f > 10 %>
+      <% logo_height = 16 %>
+    <% elsif aspect_ratio.to_f > 5 %>
+      <% logo_height = 25 %>
+    <% elsif aspect_ratio.to_f < 3 %>
+      <% logo_height = 32 %>
+    <% else %>
+      <% logo_height = 32 %>
+    <% end %>
+
+    <% if defined?(height) && height > 0 %>
+      <% logo_style += "height: #{height}px;" %>
+      <% cdn_height = height %>
+    <% elsif aspect_ratio.to_f < 3 %>
+      <% cdn_height = 64 %>
+      <% logo_style += "height: 64px;" %>
+    <% else %>
+      <% cdn_height = 32 %>
+      <% logo_style += "height: 32px;" %>
+    <% end %>
+
+    <% variant_options = spree_image_variant_options(resize_to_fit: [nil, cdn_height * 3]) %>
+
+    <%= image_tag main_app.cdn_image_url(logo.variant(variant_options)), 
+          style: "#{logo_style} width: auto;", 
+          alt: current_store.name,
+          height: cdn_height %>
+  <% else %>
+    <h1 style="margin: 0; font-size: 22px; font-weight: bold; text-align: center; text-transform: uppercase;"><%= current_store.name %></h1>
+  <% end %>
+<% end %>

data/app/views/spree/shared/_payment.html.erb

@@ -0,0 +1,41 @@
+<% source = payment.source %>
+<div class="d-flex flex items-top align-items-top gap-3">
+  <% if source.is_a?(Spree::CreditCard) %>
+    <div class="flex-shrink-0">
+      <% # display wallet icon, eg. Apple Pay, Google Pay, etc. %>
+      <%= payment_method_icon_tag source.wallet_type, height: 30 if source.try(:wallet_type).present? %>
+      <% # display card type icon, eg. Visa, Mastercard, etc. %>
+      <%= payment_method_icon_tag source.cc_type, height: 30 %>
+    </div>
+    <div>
+      <p class="mb-1"> •••• <%=source.last_digits %></p>
+      <p class="mb-0"><%= Spree.t(:expiration) %> <%= source.month %>/<%= source.year %></p>
+    </div>
+  <% elsif source.is_a?(Spree::StoreCredit) %>
+    <% if source.respond_to?(:gift_card) && source.gift_card.present? %>
+      <div class="d-flex flex rounded bg-light px-3 py-2 mb-3 align-items-center">
+        <%= icon('gift', height: 30, class: 'mr-3 text-muted') %>
+        <div>
+          <p class="mb-1"><%= Spree.t(:gift_card) %>: <strong><%= source.gift_card.code.upcase %></strong></p>
+          <%= @order.display_gift_card_total %>
+        </div>
+      </div>
+    <% elsif payment_method_icon_tag(payment.payment_method.payment_icon_name).present? %>
+      <div class="d-flex flex align-items-center items-center">
+        <div><%= payment_method_icon_tag(payment.payment_method.payment_icon_name) %></div>
+        <div class="mx-2"><%= Spree.t(:store_credit_name) %></div>
+      </div>
+    <% end %>
+  <% elsif source.present? %>
+    <div class="flex-shrink-0">
+      <%= payment_method_icon_tag source.class.to_s.demodulize.downcase, height: 30 %>
+    </div>
+  <% else %>
+    <div class="flex-shrink-0">
+      <%= payment_method_icon_tag payment.payment_method.payment_icon_name %>
+    </div>
+    <div>
+      <%= payment.payment_method.name %>
+    </div>
+  <% end %>
+</div>

data/app/views/spree/test_mailer/test_email.html.erb

@@ -0,0 +1,40 @@
+<table>
+  <tr>
+    <td>
+
+      <center>
+        <h1 class="center">
+          <%= Spree.t('test_mailer.test_email.greeting') %>
+        </h1>
+      </center>
+
+    </td>
+    <td class="expander"></td>
+  </tr>
+</table>
+
+<table>
+  <tr>
+    <td>
+
+      <p class="lede">
+        <%= Spree.t('test_mailer.test_email.message') %>
+      </p>
+
+      <p>
+        Please remember to configure all of the emails that Spree has provided to your needs.
+        Spree comes shipped with <a href="http://zurb.com/ink/" target="_blank"> Ink </a>
+        prepackaged, but you can use your own version. Ink is not placed in the asset pipeline.
+      </p>
+
+      <p>
+        Also take note that Gmail does not support <code>&lt;style&gt;</code> tags.
+        Therefore, you will need a gem that will be able to remove your <code>&lt;style&gt;</code>
+        tags and place them inline. Gmail only supports inline styles. We use
+        <a href="https://github.com/fphilipe/premailer-rails" target="_blank">Premailer for Rails</a> by default.
+      </p>
+
+    </td>
+    <td class="expander"></td>
+  </tr>
+</table>

data/app/views/spree/test_mailer/test_email.text.erb

@@ -0,0 +1,4 @@
+<%= Spree.t('test_mailer.test_email.greeting') %>
+================
+
+<%= Spree.t('test_mailer.test_email.message') %>