spree_frontend 3.1.0 → 4.7.0

data/app/views/spree/address/_form.html.erb

@@ -1,89 +1,90 @@
 <% address_id = address_type.chars.first %>
 
-<div class="inner" data-hook=<%="#{address_type}_inner" %>>
-  <p class="form-group" id=<%="#{address_id}firstname" %>>
+<div class="inner" data-hook='<%= "#{address_type}_inner" %>'>
+  <div class="form-group" id='<%= "#{address_id}firstname" %>'>
     <%= form.label :firstname do %>
       <%= Spree.t(:first_name) %><abbr class="required" title="required">*</abbr>
     <% end %>
-    <%= form.text_field :firstname, :class => 'form-control required' %>
-  </p>
-  <p class="form-group" id=<%="#{address_id}lastname" %>>
+    <%= form.text_field :firstname, class: 'form-control', required: true %>
+  </div>
+  <div class="form-group" id='<%= "#{address_id}lastname" %>'>
     <%= form.label :lastname do %>
       <%= Spree.t(:last_name) %><abbr class="required" title="required">*</abbr>
     <% end %>
-    <%= form.text_field :lastname, :class => 'form-control required' %>
-  </p>
+    <%= form.text_field :lastname, class: 'form-control', required: true %>
+  </div>
   <% if Spree::Config[:company] %>
-    <p class="form-group" id=<%="#{address_id}company" %>>
+    <div class="form-group" id='<%= "#{address_id}company" %>'>
       <%= form.label :company, Spree.t(:company) %>
-      <%= form.text_field :company, :class => 'form-control' %>
-    </p>
+      <%= form.text_field :company, class: 'form-control' %>
+    </div>
   <% end %>
-  <p class="form-group" id=<%="#{address_id}address1" %>>
+  <div class="form-group" id='<%= "#{address_id}address1" %>'>
     <%= form.label :address1 do %>
       <%= Spree.t(:street_address) %><abbr class="required" title="required">*</abbr>
     <% end %>
-    <%= form.text_field :address1, :class => 'form-control  required' %>
-  </p>
-  <p class="form-group" id=<%="#{address_id}address2" %>>
+    <%= form.text_field :address1, class: 'form-control required' %>
+  </div>
+  <div class="form-group" id='<%= "#{address_id}address2" %>'>
     <%= form.label :address2, Spree.t(:street_address_2) %>
-    <%= form.text_field :address2, :class => 'form-control' %>
-  </p>
-  <p class="form-group" id=<%="#{address_id}city" %>>
+    <%= form.text_field :address2, class: 'form-control' %>
+  </div>
+  <div class="form-group" id='<%= "#{address_id}city" %>'>
     <%= form.label :city do %>
       <%= Spree.t(:city) %><abbr class="required" title="required">*</abbr>
     <% end %>
-    <%= form.text_field :city, :class => 'form-control required' %>
-  </p>
-  <p class="form-group" id=<%="#{address_id}country" %>>
+    <%= form.text_field :city, class: 'form-control', required: true %>
+  </div>
+  <div class="form-group" id='<%= "#{address_id}country" %>'>
     <%= form.label :country_id do %>
       <%= Spree.t(:country) %><abbr class="required" title="required">*</abbr>
     <% end %>
-    <span id=<%="#{address_id}country-selection" %>>
-      <%= form.collection_select :country_id, available_countries, :id, :name, {}, {:class => 'form-control required'} %>
+    <span id='<%= "#{address_id}country-selection" %>'>
+      <%= form.collection_select :country_id, available_countries, :id, :name, {}, { class: 'form-control', required: true } %>
     </span>
-  </p>
+  </div>
 
   <% if Spree::Config[:address_requires_state] %>
-    <p class="form-group" id=<%="#{address_id}state" %>>
+    <div class="form-group" id='<%= "#{address_id}state" %>'>
       <% have_states = !address.country.states.empty? %>
       <%= form.label :state do %>
-        <%= Spree.t(:state) %><abbr class='required' title="required" id=<%="#{address_id}state-required"%>>*</abbr>
+        <%= Spree.t(:state) %><abbr class='required' title="required" id='<%= "#{address_id}state-required" %>'>*</abbr>
       <% end %>
 
       <%== state_elements = [
          form.collection_select(:state_id, address.country.states,
                             :id, :name,
-                            {:include_blank => true},
-                            {:class => have_states ? 'form-control required' : 'form-control hidden',
-                            :disabled => !have_states}) +
+                            {include_blank: true},
+                            {class: have_states ? 'form-control' : 'form-control hidden',
+                            required: have_states,
+                            disabled: !have_states}) +
          form.text_field(:state_name,
-                            :class => !have_states ? 'form-control required' : 'form-control hidden',
-                            :disabled => have_states)
-         ].join.gsub('"', "'").gsub("\n", "")
-      %>
-    </p>
+                            class: !have_states ? 'form-control' : 'form-control hidden',
+                            required: !have_states,
+                            disabled: have_states)
+         ].join.gsub('"', "'").gsub("\n", "") %>
+    </div>
       <noscript>
-        <%= form.text_field :state_name, :class => 'form-control required' %>
+        <%= form.text_field :state_name, class: 'form-control', required: true %>
       </noscript>
   <% end %>
 
-  <p class="form-group" id=<%="#{address_id}zipcode" %>>
+  <div class="form-group" id='<%= "#{address_id}zipcode" %>'>
     <%= form.label :zipcode do %>
       <%= Spree.t(:zip) %><% if address.require_zipcode? %><abbr class="required" title="required">*</abbr><% end %>
     <% end %>
-    <%= form.text_field :zipcode, :class => "form-control #{'required' if address.require_zipcode?}" %>
-  </p>
-  <p class="form-group" id=<%="#{address_id}phone" %>>
+    <%= form.text_field :zipcode, class: 'form-control', required: address.require_zipcode? %>
+  </div>
+  <div class="form-group" id='<%= "#{address_id}phone" %>'>
     <%= form.label :phone do %>
       <%= Spree.t(:phone) %><% if address.require_phone? %><abbr class="required" title="required">*</abbr><% end %>
     <% end %>
-    <%= form.phone_field :phone, :class => "form-control #{'required' if address.require_phone?}" %>
-  </p>
+    <%= form.phone_field :phone, class: 'form-control', required: address.require_phone? %>
+  </div>
   <% if Spree::Config[:alternative_shipping_phone] %>
-    <p class="form-group" id=<%="#{address_id}altphone" %>>
+    <div class="form-group" id='<%= "#{address_id}altphone" %>'>
       <%= form.label :alternative_phone, Spree.t(:alternative_phone) %>
-      <%= form.phone_field :alternative_phone, :class => 'form-control' %>
-    </p>
+      <%= form.phone_field :alternative_phone, class: 'form-control' %>
+    </div>
   <% end %>
 </div>

data/app/views/spree/addresses/_form.html.erb

@@ -0,0 +1,32 @@
+<% address_id = address_type.chars.first %>
+
+<% Spree::Address::ADDRESS_FIELDS.each do |field| %>
+  <% if field == "country" %>
+    <div class="form-group checkout-content-inner-field" id="<%= "#{address_id}country" %>">
+      <div id="<%= "#{address_id}country-selection" %>" class="d-block position-relative has-float-label">
+        <%= address_form.collection_select :country_id, available_countries, :id, :name,
+                                           { prompt: Spree.t(:country).upcase },
+                                           { class: 'form-control spree-flat-select',
+                                             aria: { label: Spree.t(:country) } } %>
+        <%= image_tag 'arrow.svg', class: 'position-absolute spree-flat-select-arrow' %>
+        <%= address_form.label(Spree.t(:country), Spree.t(:country).upcase, class:'text-uppercase') %>
+      </div>
+    </div>
+  <% elsif field == "state" %>
+    <div class="form-group mb-4">
+      <%= address_field(address_form, :state, address_id) { address_state(address_form, address.country, address_id) } if Spree::Config[:address_requires_state] %>
+    </div>
+  <% elsif field == "zipcode" %>
+    <div class="form-group mb-4">
+      <%= address_field(address_form, :zipcode, address_id) { address_zipcode(address_form, address.country, address_id) } %>
+    </div>
+  <% else %>
+    <% next if field == "company" && !Spree::Config[:company] %>
+    <% next if field == "alternative_#{address_id}_phone" && !Spree::Config["alternative_#{address_id}_phone"] %>
+    <div class="form-group mb-4">
+      <%= address_field(address_form, field.to_sym, address_id) %>
+    </div>
+  <% end %>
+<% end %>
+
+<p class="text-right text-uppercase mb-5 checkout-content-inner-field"><span id="required_marker"><%= Spree.t(:required) %></span> <%= Spree.t(:required_fields) %></p>

data/app/views/spree/addresses/destroy.js.erb

@@ -0,0 +1,2 @@
+$("#billing_address_<%= @address.id %>").fadeOut();
+$("#shipping_address_<%= @address.id %>").fadeOut();

data/app/views/spree/addresses/edit.html.erb

@@ -0,0 +1,18 @@
+<%= render 'spree/shared/error_messages', target: @address %>
+<div class="col-lg-6 offset-lg-3">
+  <h3 class="spree-header spree-mb-large spree-mt-large"><%= Spree.t(:edit_address, scope: :address_book) %></h3>
+  <%= form_for @address, html: { id: 'checkout_form_address' } do |f| %>
+  <div class="form-group checkout-content-inner-field mb-5 has-float-label">
+    <%= f.text_field :label, class: 'spree-flat-input', placeholder: Spree.t(:address_name_placeholder, scope: :address_book) %>
+    <%= f.label :address_name, Spree.t(:label, scope: :address_book) %>
+  </div>
+
+  <%= render 'spree/addresses/form',
+    address_name: 'address',
+    address_form: f,
+    address_type: 'shipping',
+    address: @address %>
+
+  <%= f.submit Spree.t(:update), class: 'btn btn-primary btn-block spree-btn mb-5' %>
+  <% end %>
+</div>

data/app/views/spree/addresses/new.html.erb

@@ -0,0 +1,17 @@
+<%= render 'spree/shared/error_messages', target: @address %>
+<div class="col-lg-6 offset-lg-3">
+  <h3 class="spree-header spree-mb-large spree-mt-large"><%= Spree.t(:new_address, scope: :address_book) %></h3>
+  <%= form_for @address, url: spree.addresses_path, html: { id: 'checkout_form_address' } do |f| %>
+  <div class="form-group checkout-content-inner-field mb-5 has-float-label">
+    <%= f.text_field :label, class: 'spree-flat-input', placeholder: Spree.t(:address_name_placeholder, scope: :address_book) %>
+    <%= f.label :address_name, Spree.t(:label, scope: :address_book) %>
+  </div>
+    <%= render 'spree/addresses/form',
+      address_name: 'address',
+      address_form: f,
+      address_type: 'shipping',
+      address: @address %>
+
+    <%= f.submit t(:save, scope: :address_book), class: 'btn btn-primary btn-block spree-btn mb-5' %>
+  <% end %>
+</div>

data/app/views/spree/checkout/_address.html.erb

@@ -1,44 +1,71 @@
-<div class="row">
-  <div class="col-sm-6" data-hook="billing_fieldset_wrapper">
-    <div class="panel panel-default" id="billing" data-hook>
-      <%= form.fields_for :bill_address do |bill_form| %>
-        <div class="panel-heading">
-          <h3 class="panel-title"><%= Spree.t(:billing_address) %></h3>
-        </div>
-        <div class="panel-body">
-          <%= render :partial => 'spree/address/form', :locals => { :form => bill_form, :address_type => 'billing', :address => @order.bill_address } %>
-        </div>
-      <% end %>
+<% if !try_spree_current_user || try_spree_current_user.email.blank? %>
+  <div class="row">
+    <div class="col-12 mb-4">
+      <div class="form-group checkout-content-inner-field has-float-label">
+        <%= form.email_field :email, class: 'required spree-flat-input', required: true, placeholder: Spree.t(:email) %>
+        <%= form.label :email, class: 'text-uppercase' %>
+      </div>
     </div>
   </div>
+<% end %>
 
-  <div class="col-sm-6" data-hook="shipping_fieldset_wrapper">
-    <div class="panel panel-default" id="shipping" data-hook>
-      <%= form.fields_for :ship_address do |ship_form| %>
-        <div class="panel-heading">
-          <h3 class="panel-title"><%= Spree.t(:shipping_address) %></h3>
-        </div>
-        <div class="panel-body">
-          <p class="field checkbox" data-hook="use_billing">
-            <%= label_tag :order_use_billing, :id => 'use_billing' do %>
-              <%= check_box_tag 'order[use_billing]', '1', @order.shipping_eq_billing_address? %>
-              <%= Spree.t(:use_billing_address) %>
+<div class="row">
+  <% ['billing', 'shipping'].each do |address_type|
+    address_name = "#{address_type[0...4]}_address" %>
+    <div class="col-12 mb-4" data-hook="<%= address_type %>_fieldset_wrapper">
+      <div id="<%= address_type %>" data-hook>
+        <h5 class="text-uppercase checkout-content-header">
+          <%= Spree.t(address_type + '_address') %>
+        </h5>
+        <% if address_type == 'shipping' %>
+          <div class="spree-checkbox-container checkout-content-billing-checkbox" data-hook="use_billing">
+            <div class="spree-checkbox">
+              <%= check_box_tag 'order[use_billing]', '1', @order.shipping_eq_billing_address?, { class: 'form-check-input'} %>
+              <%= label_tag :order_use_billing, nil, id: 'use_billing' %>
+            </div>
+            <%= label_tag :order_use_billing, Spree.t(:use_billing_address), class: 'spree-checkbox-label' %>
+          </div>
+        <% end %>
+        <% if user_available_addresses.present? %>
+        <div class="select_address mb-5">
+          <div class="form-group col">
+            <% user_available_addresses.each_with_index do |address, idx| %>
+            <div class="row mb-3" id="<%= [address_type, dom_id(address)].join('_') %>">
+              <label class="form-check-label spree-radio-label col-8">
+                <%= form.radio_button "#{address_name}_id", address.id, checked: (address.id == try_spree_current_user["#{address_name}_id"] || idx == 0) %>
+                <span class="spree-radio-label-custom-input"></span>
+                  <%= render "spree/users/address", address: address %>
+              </label>
+              <%= render "spree/users/address_controls", address: address %>
+            </div>
             <% end %>
-          </p>
-          <%= render :partial => 'spree/address/form', :locals => { :form => ship_form, :address_type => 'shipping', :address => @order.ship_address } %>
+            <div class="row mb-3">
+              <label class="form-check-label spree-radio-label col">
+                <%= form.radio_button "#{address_name}_id", 0, class: 'form-check-input' %> <h4><%= Spree.t('address_book.other_address') %></h4>
+                <span class="spree-radio-label-custom-input"></span>
+              </label>
+            </div>
+          </div>
         </div>
-      <% end %>
+        <% end %>
+        <%= form.fields_for address_name do |address_form| %>
+          <div class="inner checkout-content-inner" data-hook='<%= "#{address_type}_inner" %>'>
+            <%= render partial: 'spree/addresses/form', locals: {
+              address_name: address_name,
+              address_form: address_form,
+              address_type: address_type,
+              address: Spree::Address.new(country: current_store.default_country),
+              form: form
+            } %>
+          </div>
+        <% end %>
+      </div>
     </div>
-  </div>
+  <% end %>
+
+  <%= hidden_field_tag 'save_user_address', true, data: { hook: "save_user_address" } %>
 </div>
 
-<div class="well text-right form-buttons" data-hook="buttons">
-  <%= submit_tag Spree.t(:save_and_continue), :class => 'btn btn-lg btn-success' %>
-  <% if try_spree_current_user %>
-    <span data-hook="save_user_address">
-      &nbsp; &nbsp;
-      <%= check_box_tag 'save_user_address', '1', try_spree_current_user.respond_to?(:persist_order_address) %>
-      <%= label_tag :save_user_address, Spree.t(:save_my_address) %>
-    </span>
-  <% end %>
+<div id="delete-address-popup" class="delete-address-popup-dropdown hide-on-esc">
+  <%= render 'spree/shared/delete_address_popup' %>
 </div>

data/app/views/spree/checkout/_confirm.html.erb

@@ -1,13 +1,6 @@
-<div class="panel panel-default" id="order_details" data-hook>
-  <div class="panel-heading">
-    <h3 class="panel-title"><%= Spree.t(:confirm) %></h3>
-  </div>
-  <div class="panel-body">
-    <%= render :partial => 'spree/shared/order_details', :locals => { :order => @order } %>
-  </div>
-</div>
-
-<div class="well text-right form-buttons" data-hook="buttons">
-  <%= submit_tag Spree.t(:place_order), :class => 'btn btn-lg btn-success' %>
-  <script>Spree.disableSaveOnClick();</script>
+<div class="checkout-confirm" id="order_details" data-hook>
+  <p class="checkout-content-header">
+    <%= Spree.t(:summary).upcase %>
+  </p>
+  <%= render partial: 'spree/shared/order_details', locals: { order: @order } %>
 </div>

data/app/views/spree/checkout/_credit_card.html.erb

@@ -0,0 +1,10 @@
+<div id="<%= dom_id(card,'spree') %>" class="payment-sources-list-item">
+  <label class="form-check-label spree-radio-label">
+    <%= radio_button_tag "order[existing_card]", card.id, (card == @payment_sources.first), { class: "existing-cc-radio" } %>
+    <span class="spree-radio-label-custom-input"></span>
+    <%= credit_card_icon(card.cc_type) %>
+    <span>****<%= card.last_digits %>,&nbsp</span>
+    <span><%= card.name %></span>
+    <%= button_tag Spree.t(:remove), type: 'button', class: 'btn text-left d-block p-0 js-remove-credit-card', data: { id: card.id } %>
+  </label>
+</div>

data/app/views/spree/checkout/_delivery.html.erb

@@ -1,101 +1,47 @@
-<div class="panel panel-default" id='shipping_method' data-hook>
-  <div class="panel-heading">
-    <h3 class="panel-title"><%= Spree.t(:delivery) %></h3>
-  </div>
-  <div class="panel-body" data-hook="shipping_method_inner">
+<div id="shipping-method" data-hook>
+  <div data-hook="shipping_method_inner">
     <div id="methods">
       <%= form.fields_for :shipments do |ship_form| %>
         <div class="shipment">
-          <h4 class="stock-location" data-hook="stock-location">
-            <%= Spree.t(:package_from) %>
-            <strong class="stock-location-name" data-hook="stock-location-name"><%= ship_form.object.stock_location.name %></strong>
+          <h4 class="text-uppercase checkout-content-header checkout-content-shipping-methods-header mb-1">
+            <%= Spree.t('checkout_page.delivery_method') %>
           </h4>
+          <div id="shipToLocation" class="mb-4 text-uppercase">
+            <%= Spree.t(:ship_to) %>
+            <span class="text-muted"><%= @order.shipping_address.address1 %></span> -
+              <% if @order.shipping_address.zipcode.present? %> <span class="text-muted"><%= @order.shipping_address.zipcode %></span> - <% end %>
+            <span class="text-muted"><%= @order.shipping_address.country_iso %></span>
+          </div>
 
-          <table class="table stock-contents" data-hook="stock-contents">
-            <colgroup>
-              <col style="width: 10%;" />
-              <col style="width: 60%;" />
-              <col style="width: 10%;" />
-              <col style="width: 20%;" />
-            </colgroup>
-            <thead>
-              <tr class="active">
-                <th></th>
-                <th align='left'><%= Spree.t(:item) %></th>
-                <th><%= Spree.t(:qty) %></th>
-                <th><%= Spree.t(:price) %></th>
-              </tr>
-            </thead>
-            <tbody>
-              <% ship_form.object.manifest.each do |item| %>
-                <tr class="stock-item">
-                  <td class="item-image"><%= mini_image(item.variant) %></td>
-                  <td class="item-name"><%= item.variant.name %></td>
-                  <td class="item-qty"><%= item.quantity %></td>
-                  <td class="item-price"><%= display_price(item.variant) %></td>
-                </tr>
-              <% end %>
-            </tbody>
-          </table>
-
-          <h4 class="stock-shipping-method-title"><%= Spree.t(:shipping_method) %></h4>
-          <ul class="list-group shipping-methods">
+          <ul class="checkout-content-shipping-methods-list">
             <% ship_form.object.shipping_rates.each do |rate| %>
-              <li class="list-group-item shipping-method">
-                <label>
-                  <%= ship_form.radio_button :selected_shipping_rate_id, rate.id %>
+              <li class="shipping-method">
+                <label class="spree-radio-label">
+                  <%= ship_form.radio_button :selected_shipping_rate_id,
+                    rate.id,
+                    data: {
+                      behavior: 'shipping-method-selector',
+                      cost: rate.display_cost,
+                      tax: rate.display_tax_amount
+                    } %>
+                  <span class="spree-radio-label-custom-input"></span>
                   <span class="rate-name"><%= rate.name %></span>
-                  <span class="badge rate-cost"><%= rate.display_cost %></span>
+                  <p class="rate-cost"><%= rate.display_cost %></p>
                 </label>
               </li>
             <% end %>
           </ul>
         </div>
       <% end %>
-
-      <% if @differentiator.try(:missing?) %>
-        <div class="shipment unshippable">
-          <h3 class="stock-location" data-hook="stock-location">
-            <%= Spree.t(:unshippable_items) %>
-          </h3>
-          <table class="table stock-contents" data-hook="stock-missing">
-            <colgroup>
-              <col style="width: 10%;" />
-              <col style="width: 60%;" />
-              <col style="width: 10%;" />
-              <col style="width: 20%;" />
-            </colgroup>
-            <thead>
-              <th></th>
-              <th align='left'><%= Spree.t(:item) %></th>
-              <th><%= Spree.t(:qty) %></th>
-              <th><%= Spree.t(:price) %></th>
-            </thead>
-            <tbody>
-              <% @differentiator.missing.each do |variant, quantity| %>
-                <tr class="stock-item">
-                  <td class="item-image"><%= mini_image(variant) %></td>
-                  <td class="item-name"><%= variant.name %></td>
-                  <td class="item-qty"><%= quantity %></td>
-                  <td class="item-price"><%= display_price(variant) %></td>
-                </tr>
-              <% end %>
-            </tbody>
-          </table>
-        </div>
-      <% end %>
     </div>
-    <% if Spree::Config[:shipping_instructions] %>
-      <p id="minstrs" data-hook>
-        <h4><%= Spree.t(:shipping_instructions) %></h4>
-        <%= form.text_area :special_instructions, :cols => 40, :rows => 4, :class => "form-control" %>
-      </p>
+
+    <% if Spree::Frontend::Config[:shipping_instructions] %>
+      <div id="minstrs" data-hook>
+        <h4 class="h5">
+          <%= Spree.t(:shipping_instructions) %>
+        </h4>
+        <%= form.text_area :special_instructions, cols: 40, rows: 4, class: "form-control" %>
+      </div>
     <% end %>
   </div>
 </div>
-
-<br />
-
-<div class="well text-right form-buttons" data-hook="buttons">
-  <%= submit_tag Spree.t(:save_and_continue), :class => 'btn btn-lg btn-success' %>
-</div>

data/app/views/spree/checkout/_delivery_informations.html.erb

@@ -0,0 +1,51 @@
+<div class="checkout-confirm-delivery-informations text-left mt-3 <%= class_name %>">
+  <div class="d-lg-none checkout-confirm-delivery-informations-header">
+    <%= Spree.t(:delivery_information) %>
+  </div>
+  <dl>
+    <% if order.has_step?("address") %>
+      <div data-hook="order-ship-address">
+        <dt class="text-uppercase">
+          <%= Spree.t(:shipping_address) %>
+          <%= checkout_edit_link %>
+        </dt>
+        <%= render 'spree/shared/address', address: order.ship_address %>
+      </div>
+      <div data-hook="order-bill-address">
+        <dt class="text-uppercase">
+          <%= Spree.t(:billing_address) %>
+          <%= checkout_edit_link %>
+        </dt>
+        <%= render 'spree/shared/address', address: order.bill_address %>
+      </div>
+    <% end %>
+    <% if order.has_step?("delivery") %>
+      <div data-hook="order-shipment">
+        <dt class="text-uppercase">
+          <%= Spree.t(:shipping) %>
+          <%= checkout_edit_link('delivery') %>
+        </dt>
+        <% @order.shipments.valid.each do |shipment| %>
+          <dd><%= shipment.shipping_method&.name %> </dd>
+        <% end %>
+        <%= render 'spree/shared/shipment_tracking', order: order if order.shipped? %>
+      </div>
+    <% end %>
+    <% if order.has_step?("payment") %>
+      <div data-hook="order-payment">
+        <dt class="text-uppercase">
+          <%= Spree.t(:payment) %>
+          <%= checkout_edit_link('payment') %>
+        </dt>
+        <dd>
+          <%= render collection: @order.payments.valid, partial: 'spree/shared/payment' %>
+        </dd>
+        <dd>
+          <% if @order.using_store_credit? %>
+            <%= button_tag Spree.t('store_credit.remove'), name: 'remove_store_credit', class: 'continue btn' %>
+          <% end %>
+        </dd>
+      </div>
+    <% end %>
+  </dl>
+</div>