spree_backend 4.4.1 → 4.5.0

data/app/views/spree/admin/dashboard/_apis.html.erb

@@ -0,0 +1,30 @@
+<h4 class="mb-3">APIs</h4>
+
+<ul class="list-group mb-5">
+  <li class="list-group-item">
+    Storefront API <code class="float-right"><%= current_store.formatted_url %>/api/v2/storefront</code>
+    <br />
+    <small class="text-muted">
+      <%= link_to 'Learn more', 'https://api.spreecommerce.org/docs/api-v2/api/docs/v2/storefront/index.yaml', target: :blank %>
+    </small>
+    <small class="text-muted float-right">
+      <%= link_to 'Download SDK', 'https://github.com/spree/spree-storefront-api-v2-js-sdk', class: 'btn btn-sm btn-light', target: :blank %>
+    </small>
+  </li>
+  <li class="list-group-item">
+    Platform API <code class="float-right"><%= current_store.formatted_url %>/api/v2/platform</code>
+    <br />
+    <small class="text-muted">
+      <%= link_to 'Learn more', 'https://api.spreecommerce.org/docs/api-v2/YXBpOjg3MzkxODk-platform-api', target: :blank %>
+    </small>
+    <small class="text-muted float-right">
+      <%= link_to 'Create Platform application', spree.admin_oauth_applications_path, class: 'btn btn-sm btn-light' %>
+    </small>
+  </li>
+  <li class="list-group-item">
+    Webhooks
+    <small class="text-muted float-right">
+      <%= link_to 'Create Webhook subscriber', spree.admin_webhooks_subscribers_path, class: 'btn btn-sm btn-light' %>
+    </small>
+  </li>
+</ul>

data/app/views/spree/admin/dashboard/_getting_started.html.erb

@@ -0,0 +1,101 @@
+<h4 class="mb-3">Let's get you started</h4>
+
+<div class="row mb-3">
+  <div class="col-4">
+    <div class="list-group" id="list-tab" role="tablist">
+      <a class="list-group-item list-group-item-action <% if @products_added %>list-group-item-info<% elsif @active_tab == 'products' %>active<% end %>" id="list-products-list" data-toggle="list" href="#list-products" role="tab" aria-controls="products">
+        <% if @products_added %>
+          <%= svg_icon name: 'check-circle-fill', width: 20, height: 20, classes: "mr-3" %>
+        <% else %>
+          <%= svg_icon name: 'tags', width: 20, height: 20, classes: "mr-3" %>
+        <% end %>
+        Add products
+      </a>
+      <a class="list-group-item list-group-item-action <% if @shipping_methods_added %>list-group-item-info<% elsif @active_tab == 'shipping' %>active<% end %>" id="list-shipping-list" data-toggle="list" href="#list-shipping" role="tab" aria-controls="shipping">
+        <% if @shipping_methods_added %>
+          <%= svg_icon name: 'check-circle-fill', width: 20, height: 20, classes: "mr-3" %>
+        <% else %>
+          <%= svg_icon name: 'truck', width: 20, height: 20, classes: "mr-3" %>
+        <% end %>
+        Setup shipping
+      </a>
+      <a class="list-group-item list-group-item-action <% if @payment_methods_added %>list-group-item-info<% elsif @active_tab == 'payments' %>active<% end %>" id="list-payments-list" data-toggle="list" href="#list-payments" role="tab" aria-controls="payments">
+        <% if @payment_methods_added %>
+          <%= svg_icon name: 'check-circle-fill', width: 20, height: 20, classes: "mr-3" %>
+        <% else %>
+          <%= svg_icon name: 'cash-coin', width: 20, height: 20, classes: "mr-3" %>
+        <% end %>
+        Setup payment methods
+      </a>
+      <a class="list-group-item list-group-item-action <% if @taxes_added %>list-group-item-info<% elsif @active_tab == 'taxes' %>active<% end %>" id="list-taxes-list" data-toggle="list" href="#list-taxes" role="tab" aria-controls="taxes">
+        <% if @taxes_added %>
+          <%= svg_icon name: 'check-circle-fill', width: 20, height: 20, classes: "mr-3" %>
+        <% else %>
+          <%= svg_icon name: 'receipt', width: 20, height: 20, classes: "mr-3" %>
+        <% end %>
+        Setup taxes
+      </a>
+    </div>
+  </div>
+  <div class="col-8">
+    <div class="tab-content" id="nav-tabContent">
+      <div class="tab-pane fade <% if @active_tab == 'products'%>show active<% end %>" id="list-products" role="tabpanel" aria-labelledby="list-products-list">
+        <% if @products_added %>
+          <p>
+            You have added <strong><%= current_store.products.count %> products</strong> so far - good job!</p>
+        <% else %>
+          <p>
+            You can add products manually through API or import from a CSV file.
+          </p>
+          <%= link_to_with_icon 'add.svg', 'Add products', spree.admin_products_path, class: 'btn btn-success btn-sm mb-2' %>
+        <% end %>
+      </div>
+      <div class="tab-pane fade <% if @active_tab == 'shipping'%>show active<% end %>" id="list-shipping" role="tabpanel" aria-labelledby="list-shipping-list">
+        <% if @shipping_methods_added %>
+          <p>
+            You have setup shipping for:
+            <% @shippable_countries.each do |country| %>
+              <strong class="mr-2">
+                <%= country.name %>
+                <%= flag_icon(country.iso, class: 'border border-gray rounded') %>
+              </strong>
+            <% end %>
+          </p>
+        <% else %>
+          <p>
+            You can add multiple shipping methods, different for each country, continent or region.
+          </p>
+          <%= link_to_with_icon 'settings.svg', 'Setup shipping', spree.admin_shipping_methods_path, class: 'btn btn-primary btn-sm mb-2' %>
+        <% end %>
+      </div>
+      <div class="tab-pane fade <% if @active_tab == 'payments'%>show active<% end %>" id="list-payments" role="tabpanel" aria-labelledby="list-payments-list">
+        <% if @payment_methods_added %>
+          <p>
+            You're ready to accept payments!
+          </p>
+        <% else %>
+          <p>
+            You can setup multiple payment methods such as Stripe, PayPal, ApplePay, etc.
+          </p>
+          <%= link_to_with_icon 'settings.svg', 'Setup payment methods', spree.admin_payment_methods_path, class: 'btn btn-primary btn-sm mb-2' %>
+        <% end %>
+      </div>
+      <div class="tab-pane fade <% if @active_tab == 'taxes' %>show active<% end %>" id="list-taxes" role="tabpanel" aria-labelledby="list-taxes-list">
+        <% if @taxes_added %>
+          <p>
+            You're tax calculation is setup!
+          </p>
+        <% else %>
+          <p>
+            You can use tax services such as TaxJar or setup tax calculation manually
+          </p>
+          <%= link_to_with_icon 'settings.svg', 'Setup tax calculation', spree.admin_tax_rates_path, class: 'btn btn-primary btn-sm mb-2' %>
+        <% end %>
+
+      </div>
+    </div>
+  </div>
+</div>
+
+
+

data/app/views/spree/admin/dashboard/show.html.erb

@@ -0,0 +1,3 @@
+<%= render 'getting_started' unless @onboarding_complete %>
+
+<%= render 'apis' %>

data/app/views/spree/admin/digitals/_form.html.erb

@@ -19,13 +19,13 @@
       <% end %>
     </div>
   <% else %>
-    <div class="alert alert-info no-objects-found">
+    <div class="text-center no-objects-found m-5">
       <%= Spree.t('admin.digitals.no_digital_assets_added') %>
     </div>
   <% end %>
 
   <%= f.field_container :attachment, data: {controller: "upload-button"} do %>
-    <%= f.label :file, Spree.t('admin.digitals.add_new_file'), id: "digital_attachment_#{variant.id}" %> <span class="required">*</span><br>
+    <%= f.label :file, Spree.t('admin.digitals.add_new_file'), id: "digital_attachment_#{variant.id}" %> <span class="required font-weight-bold text-danger">*</span><br>
     <%= f.file_field :attachment, id: "digital_attachment_#{variant.id}", required: true, data: { action: "input->upload-button#buttonState" } %>
     <%= hidden_field_tag 'digital[variant_id]', variant.id %>
     <%= button Spree.t('admin.digitals.upload'), 'add.svg', 'submit', { data: { upload_button_target: "uploadButton" } } %>

data/app/views/spree/admin/digitals/index.html.erb

@@ -9,9 +9,7 @@
             <h5 class="card-title mb-0"><%= variant.options_text %></h5>
           </div>
           <div class="card-body">
-            <div class="col-12 p-0">
-              <%= render 'form', variant: variant %>
-            </div>
+            <%= render 'form', variant: variant %>
           </div>
         </div>
       </div>

data/app/views/spree/admin/images/edit.html.erb

@@ -5,15 +5,15 @@
 <%= form_for [:admin, @product, @image], html: { multipart: true } do |f| %>
   <div data-hook="edit_image" class="card mb-3">
     <div class="card-header">
-      <h1 class="card-title mb-0 h5">
+      <h5 class="card-title mb-0 h6">
         <%= @image.attachment_file_name %>
-      </h1>
+      </h5>
     </div>
     <div class="card-body">
       <div class="form-group">
         <div data-hook="thumbnail" class="col-12 col-lg-3 text-center">
           <%= f.label Spree.t(:thumbnail) %>
-          <%= link_to image_tag(main_app.url_for(@image.url(:small))), main_app.rails_blob_url(@image.attachment) %>
+          <%= link_to image_tag(main_app.cdn_image_url(@image.url(:small))), main_app.cdn_image_url(@image.attachment) %>
         </div>
         <div class="col-12 col-lg-9">
           <%= render partial: 'form', locals: { f: f } %>

data/app/views/spree/admin/images/index.html.erb

@@ -2,26 +2,27 @@
 
 <% content_for :page_actions do %>
   <%= yield :page_actions %>
-  <%= product_preview_link(@product) %>
+  <%= external_page_preview_link(@product) %>
   <%= button_link_to(Spree.t(:new_image), spree.new_admin_product_image_url(@product), { class: "btn-success", icon: 'add.svg', id: 'new_image_link' }) if can? :create, Spree::Image %>
 <% end %>
 
 <% has_variants = @product.has_variants? %>
 
 <% unless @product.variant_images.any? %>
-  <div class="alert alert-warning">
+  <div class="text-center no-objects-found m-5">
     <%= Spree.t(:no_resource_found, resource: plural_resource_name(Spree::Image)) %>.
   </div>
 <% else %>
-<div class="table-responsive">
+<div class="table-responsive border rounded bg-white">
   <table class="table sortable" data-hook="images_table" data-sortable-link="<%= update_positions_admin_product_images_url(@product) %>">
-    <thead>
+    <thead class="text-muted">
       <tr data-hook="images_header">
-        <th colspan="2">
+        <th></th>
+        <th class="text-center">
           <%= Spree.t(:thumbnail) %>
         </th>
         <% if has_variants %>
-          <th>
+          <th class="text-center">
             <%= Spree::Variant.model_name.human %>
           </th>
         <% end %>
@@ -37,21 +38,21 @@
         <tr id="<%= spree_dom_id image %>" data-hook="images_row">
           <td class="move-handle text-center">
             <% if can? :edit, image %>
-              <%= svg_icon name: "sort.svg", width: '18', height: '18' %>
+              <%= svg_icon name: "grip-vertical.svg", width: '18', height: '18' %>
             <% end %>
           </td>
-          <td class="image">
+          <td class="image text-center">
             <div class="admin-product-image-container small-img">
-              <%= link_to image_tag(main_app.url_for(image.url(:product))), main_app.rails_blob_url(image.attachment) %>
+              <%= link_to image_tag(main_app.cdn_image_url(image.url(:product))), main_app.cdn_image_url(image.attachment), target: :blank %>
             </div>
           </td>
           <% if has_variants %>
-            <td><%= options_text_for(image) %></td>
+            <td class="text-center"><%= options_text_for(image) %></td>
           <% end %>
           <td><%= image.alt %></td>
           <td class="actions">
             <span class="d-flex justify-content-end">
-              <%= link_to_with_icon('edit.svg', Spree.t(:edit), spree.edit_admin_product_image_url(@product, image), class: 'btn btn-primary btn-sm', no_text: true, data: { action: 'edit' }) if can? :edit, image %>
+              <%= link_to_with_icon('edit.svg', Spree.t(:edit), spree.edit_admin_product_image_url(@product, image), class: 'btn btn-light btn-sm', no_text: true, data: { action: 'edit' }) if can? :edit, image %>
               <%= link_to_delete(image, { url: spree.admin_product_image_url(@product, image), no_text: true }) if can? :destroy, image %>
             </span>
           </td>

data/app/views/spree/admin/log_entries/index.html.erb

@@ -10,10 +10,10 @@
 <% content_for :page_actions do %>
   <%= button_link_to Spree.t(:logs), spree.admin_order_payment_log_entries_url(@order, @payment), icon: 'file.svg' %>
 <% end %>
-<div class="table-responsive">
+<div class="table-responsive border rounded bg-white">
 <table class="table" id='listing_log_entries'>
   <% @log_entries.each do |entry| %>
-      <thead>
+      <thead class="text-muted">
         <tr class="log_entry <%= entry.parsed_details.success? ? 'success' : 'fail' %>">
           <td colspan="2">
             <h4>

data/app/views/spree/admin/menu_items/_form.html.erb

@@ -52,27 +52,14 @@
           <% end %>
 
           <% @menu_item.build_icon unless @menu_item.icon %>
-            <%= f.fields_for :icon do |icon_field| %>
-              <%= f.field_container :icon_attachment do %>
-                <% unless @menu_item.icon.new_record? %>
-                  <div id="menuItemImgContainer" class="my-3 ">
-                    <%= image_tag(main_app.url_for(@menu_item.icon.attachment)) %>
-                    <%= link_to Spree.t(:remove_image), remove_icon_admin_menu_menu_item_path(@menu, @menu_item), method: :delete %>
-                  </div>
-                <% end %>
-              <div id="<% unless @menu_item.icon.new_record? %>MenuItemImageButton<% end %>">
-                <%= icon_field.file_field :attachment %>
-              </div>
-              <small class="form-text text-muted">
-                <%= raw Spree.t('admin.navigation.image_info') %>
-              </small>
-            <% end %>
+          <%= f.fields_for :icon do |ff| %>
+            <%= render partial: 'icon_upload_form', locals: { f: f, ff: ff } %>
 
             <%= f.field_container :icon_alt do %>
               <% unless @menu_item.icon.new_record? %>
                 <div class="form-group my-3">
-                  <%= icon_field.label :alt, Spree.t('admin.navigation.image_alt_text') %>
-                  <%= icon_field.text_field :alt, class: 'form-control' %>
+                  <%= ff.label :alt, Spree.t('admin.navigation.image_alt_text') %>
+                  <%= ff.text_field :alt, class: 'form-control' %>
                 </div>
               <% end %>
             <% end %>

data/app/views/spree/admin/menu_items/_icon_upload_form.html.erb

@@ -0,0 +1,14 @@
+<%= f.field_container :icon_attachment do %>
+  <% unless @menu_item.icon.new_record? %>
+    <div id="menuItemImgContainer" class="my-3 ">
+      <%= image_tag(main_app.cdn_image_url(@menu_item.icon.attachment)) %>
+      <%= link_to Spree.t(:remove_image), remove_icon_admin_menu_menu_item_path(@menu, @menu_item), method: :delete %>
+    </div>
+  <% end %>
+  <div id="<% unless @menu_item.icon.new_record? %>MenuItemImageButton<% end %>">
+    <%= ff.file_field :attachment %>
+  </div>
+<% end %>
+<small class="form-text text-muted">
+  <%= raw Spree.t('admin.navigation.image_info') %>
+</small>

data/app/views/spree/admin/menus/edit.html.erb

@@ -44,7 +44,7 @@
                      <%= build_sortable_tree(@menu, root_children) %>
                 <% end %>
               <% else %>
-                <div class="alert alert-info no-objects-found m-5">
+                <div class="text-center no-objects-found m-5 m-5">
                   <%= raw Spree.t('admin.navigation.no_menu_items', menu: @menu.root.name) %>
                 </div>
               <% end %>

data/app/views/spree/admin/menus/index.html.erb

@@ -40,13 +40,13 @@
 <% end %>
 
 <% if @menus.any? %>
-<div class="table-responsive">
+<div class="table-responsive border rounded bg-white">
   <table class="table" id="menusTable">
-    <thead>
+    <thead class="text-muted">
       <th scope="col"><%= Spree.t(:name) %></th>
       <th scope="col"><%= Spree.t('location') %></th>
       <th scope="col"><%= Spree.t('language') %></th>
-      <th class="text-center" scope="col"><%= Spree.t('default') %>
+      <th class="text-center" scope="col" class="text-center"><%= Spree.t('default') %>
         <span data-show-info
               data-alert-kind="info"
               data-alert-title="<%= Spree.t('admin.navigation.default_menus_info.title') %>"
@@ -54,7 +54,7 @@
           <%= svg_icon name: "info.svg", width: '15', height: '15' %>
         </span>
       </th>
-      <th scope="col"></th>
+      <th scope="col" class="text-center"></th>
     </thead>
     <tbody>
       <% @menus.each do |menu| %>
@@ -84,7 +84,7 @@
 </div>
 <%= render 'spree/admin/shared/index_table_options', collection: @menus, simple: true %>
 <% else %>
-  <div class="alert alert-info no-objects-found">
+  <div class="text-center no-objects-found m-5">
     <%= Spree.t('admin.navigation.you_have_no_menus') %>
   </div>
 <% end %>

data/app/views/spree/admin/oauth_applications/_form.html.erb

@@ -1,12 +1,12 @@
 <div data-hook="admin_oauth_application_form_fields">
   <%= f.field_container :name, 'data-hook' => "oauth_application_name" do %>
-    <%= f.label :name, Spree.t(:name) %> <span class="required">*</span>
+    <%= f.label :name, raw(Spree.t(:name) + required_span_tag) %>
     <%= f.text_field :name, class: 'form-control', required: true %>
     <%= f.error_message_on :name %>
   <% end %>
 
   <%= f.field_container :scopes, 'data-hook' => "oauth_application_scopes" do %>
-    <%= f.label :scopes, Spree.t(:scopes) %> <span class="required">*</span>
+    <%= f.label :scopes, raw(Spree.t(:scopes) + required_span_tag) %>
     <%= f.text_field :scopes, class: 'form-control' %>
     <%= f.error_message_on :scopes %>
     <small class="form-text text-muted">

data/app/views/spree/admin/oauth_applications/create.turbo_stream.erb

@@ -3,7 +3,7 @@
     <div class="form-group">
       <%= label_tag :client_id, 'Client ID' %>
       <div class="input-group">
-        <%= text_area_tag :client_id, @object.uid, class: 'form-control bg-transparent p-0 mt-4 mr-4 border-0', rows: 2, data: { clipboard_target: 'source', action: 'clipboard#copy' }, readonly: true %>
+        <%= text_area_tag :client_id, @object.uid, class: 'form-control bg-transparent p-0 mt-4 mr-4 border-0 shadow-none', rows: 2, data: { clipboard_target: 'source', action: 'clipboard#copy' }, readonly: true %>
         <div class="input-append">
           <button data-action="clipboard#copy" class="btn m-0 mt-4">
             <%= svg_icon name: 'clone.svg', width: 18, height: 18 %>
@@ -18,7 +18,7 @@
     <div class="form-group">
       <%= label_tag :client_secret, 'Client Secret' %>
       <div class="input-group">
-        <%= text_area_tag :client_secret, @object.plaintext_secret, class: 'form-control bg-transparent p-0 mt-4 mr-4 border-0', rows: 2, data: { clipboard_target: 'source', action: 'clipboard#copy' }, readonly: true %>
+        <%= text_area_tag :client_secret, @object.plaintext_secret, class: 'form-control bg-transparent p-0 mt-4 mr-4 border-0 shadow-none', rows: 2, data: { clipboard_target: 'source', action: 'clipboard#copy' }, readonly: true %>
         <div class="input-append">
           <button data-action="clipboard#copy" class="btn m-0 mt-4">
             <%= svg_icon name: 'clone.svg', width: 18, height: 18 %>

data/app/views/spree/admin/oauth_applications/index.html.erb

@@ -7,9 +7,9 @@
 <% end if can? :create, Spree::OauthApplication %>
 
 <% if @oauth_applications.any? %>
-  <div class="table-responsive mt-4">
+  <div class="table-responsive rounded border mt-4">
     <table class="table">
-      <thead>
+      <thead class="text-muted">
         <tr data-hook="admin_roles_index_headers">
           <th><%= Spree.t(:name) %></th>
           <th><%= Spree.t('admin.oauth_applications.uid') %></th>
@@ -23,9 +23,9 @@
             <td><%= application.name %></td>
             <td>
               <div class="input-group" data-controller="password-toggle">
-                <%= password_field_tag :password, application.uid, class: 'form-control unhide text-muted border-0 bg-transparent', data: { password_toggle_target: 'unhide' }, readonly: true %>
+                <%= password_field_tag :password, application.uid, class: 'form-control unhide text-muted border-0 shadow-none bg-transparent', data: { password_toggle_target: 'unhide' }, readonly: true %>
                 <div class="input-group-append">
-                  <%= button_tag class: 'btn btn-link', data: { action: 'click->password-toggle#password' } do %>
+                  <%= button_tag class: 'btn btn-link rounded', data: { action: 'click->password-toggle#password' } do %>
                     <%= svg_icon name: "view.svg", width: '18', height: '18' %>
                   <% end %>
                 </div>

data/app/views/spree/admin/option_types/_form.html.erb

@@ -1,7 +1,7 @@
 <div data-hook="admin_option_type_form_fields" class="row">
   <div class="col-12 col-md-6">
     <%= f.field_container :name do %>
-      <%= f.label :name, Spree.t(:name) %> <span class="required">*</span>
+      <%= f.label :name, raw(Spree.t(:name) + required_span_tag) %>
       <%= f.text_field :name, class: "form-control" %>
       <%= f.error_message_on :name %>
     <% end %>
@@ -9,7 +9,7 @@
 
   <div class="col-12 col-md-6">
     <%= f.field_container :presentation do %>
-      <%= f.label :presentation, Spree.t(:presentation) %> <span class="required">*</span>
+      <%= f.label :presentation, raw(Spree.t(:presentation) + required_span_tag) %>
       <%= f.text_field :presentation, class: "form-control" %>
       <%= f.error_message_on :presentation %>
     <% end %>

data/app/views/spree/admin/option_types/_option_value_fields.html.erb

@@ -1,6 +1,6 @@
 <tr class="option_value fields" id="spree_<%= dom_id(f.object) %>" data-hook="option_value">
   <td class="move-handle text-center">
-    <%= svg_icon name: "sort.svg", width: '18', height: '18' %>
+    <%= svg_icon name: "grip-vertical.svg", width: '18', height: '18' %>
     <%= f.hidden_field :id %>
   </td>
   <td class="name"><%= f.text_field :name, class: "form-control", required: true %></td>

data/app/views/spree/admin/option_types/edit.html.erb

@@ -3,46 +3,51 @@
   <%= @option_type.name %>
 <% end %>
 
-<% content_for :page_actions do %>
-  <span id="new_add_option_value" data-hook>
-    <%= button_link_to Spree.t(:add_option_value), "javascript:;", { icon: 'add.svg', :'data-target' => "tbody#sortVert", class: 'btn-success spree_add_fields' } %>
-  </span>
-<% end %>
-
 <%= render partial: 'spree/admin/shared/error_messages', locals: { target: @option_type } %>
 
 <%= form_for [:admin, @option_type] do |f| %>
   <div class="card mb-3">
     <div class="card-header">
-      <h1 class="card-title mb-0 h5">
+      <h5 class="card-title mb-0 h6">
         <%= Spree.t(:option_values) %>
-      </h1>
+      </h5>
     </div>
     <div class="card-body">
       <%= render partial: 'form', locals: { f: f } %>
     </div>
-    <div class="table-responsive">
-      <table class="table table-condensed sortable" data-hook data-sortable-link="<%= update_values_positions_admin_option_types_url %>">
-        <thead data-hook="option_header">
-          <tr>
-            <th colspan="2"><%= Spree.t(:name) %> <span class="required">*</span></th>
-            <th><%= Spree.t(:display) %> <span class="required">*</span></th>
-            <th class="actions"></th>
-          </tr>
-        </thead>
-        <tbody id="sortVert">
-          <% if @option_type.option_values.empty? %>
-            <tr id="none" data-hook="option_none">
-              <td colspan="2"><%= Spree.t(:none) %></td>
-              <td class="actions text-center"></td>
+    <div class="card-body">
+      <div class="table-responsive border rounded bg-white">
+        <table class="table table-condensed sortable" data-hook data-sortable-link="<%= update_values_positions_admin_option_types_url %>">
+          <thead data-hook="option_header">
+            <tr>
+              <th colspan="2"><%= raw(Spree.t(:name) + required_span_tag) %></th>
+              <th><%= raw(Spree.t(:display) + required_span_tag) %></th>
+              <th class="actions"></th>
             </tr>
-          <% else %>
-            <%= f.fields_for :option_values do |option_value_form| %>
-              <%= render partial: 'option_value_fields', locals: { f: option_value_form } %>
+          </thead>
+          <tbody id="sortVert">
+            <% if @option_type.option_values.empty? %>
+              <tr id="none" data-hook="option_none">
+                <td colspan="2"><%= Spree.t(:none) %></td>
+                <td class="actions text-center"></td>
+              </tr>
+            <% else %>
+              <%= f.fields_for :option_values do |option_value_form| %>
+                <%= render partial: 'option_value_fields', locals: { f: option_value_form } %>
+              <% end %>
             <% end %>
-          <% end %>
-        </tbody>
-      </table>
+          </tbody>
+          <tfoot>
+            <tr>
+              <td colspan="4">
+                <div id="new_add_option_value" class="d-flex" data-hook>
+                  <%= button_link_to Spree.t(:add_option_value), "javascript:;", { icon: 'add.svg', :'data-target' => "tbody#sortVert", class: 'btn-success mx-auto spree_add_fields' } %>
+                </div>
+              </td>
+            </tr>
+          </tfoot>
+        </table>
+      </div>
     </div>
     <div class="card-footer text-center">
       <%= render partial: 'spree/admin/shared/edit_resource_links' %>

data/app/views/spree/admin/option_types/index.html.erb

@@ -11,9 +11,9 @@
 <div id="new_option_type"></div>
 
 <% if @option_types.any? %>
-<div class="table-responsive">
+<div class="table-responsive border rounded bg-white">
   <table class="table sortable" id="listing_option_types" data-hook data-sortable-link="<%= update_positions_admin_option_types_url %>">
-    <thead>
+    <thead class="text-muted">
       <tr data-hook="option_header">
         <th class="no-border handel-head"></th>
         <th><%= Spree.t(:name) %></th>
@@ -26,7 +26,7 @@
       <% @option_types.each do |option_type| %>
         <tr class="spree_option_type <%= cycle('odd', 'even') %>" id="<%= spree_dom_id option_type %>" data-hook="option_row">
           <td class="move-handle text-center">
-            <%= svg_icon name: "sort.svg", width: '18', height: '18' %>
+            <%= svg_icon name: "grip-vertical.svg", width: '18', height: '18' %>
           </td>
           <td><%= option_type.name %></td>
           <td class="presentation"><%= option_type.presentation %></td>
@@ -43,7 +43,7 @@
   </table>
 </div>
 <% else %>
-  <div class="alert alert-info no-objects-found">
+  <div class="text-center no-objects-found m-5">
     <%= Spree.t(:no_resource_found, resource: plural_resource_name(Spree::OptionType)) %>,
     <%= link_to Spree.t(:add_one), new_object_url if can?(:create, Spree::OptionType) %>!
   </div>

data/app/views/spree/admin/orders/_add_line_item.html.erb

@@ -4,7 +4,7 @@
 
 <div id="add-line-item" data-hook class="card mb-3">
   <div class="card-header">
-    <h1 class="card-title mb-0 h5"><%= Spree.t(:add_product) %></h1>
+    <h5 class="card-title mb-0 h6"><%= Spree.t(:add_product) %></h5>
   </div>
   <div class="card-body">
     <div data-hook="add_product_name" class="form-group">

data/app/views/spree/admin/orders/_add_product.html.erb

@@ -3,9 +3,9 @@
 
 <div class="card mb-3" id="add-line-item" data-hook>
   <div class="card-header">
-    <h1 class="card-title mb-0 h5">
+    <h5 class="card-title mb-0 h6">
       <%= Spree.t(:add_product) %>
-    </h1>
+    </h5>
   </div>
   <div class="card-body">
     <div data-hook="add_product_name">

data/app/views/spree/admin/orders/_adjustments.html.erb

@@ -1,13 +1,13 @@
 <% if adjustments.eligible.exists? %>
   <div class="card mb-3">
     <div class="card-header">
-      <h1 class="card-title mb-0 h5">
+      <h5 class="card-title mb-0 h6">
         <%= title %>
-      </h1>
+      </h5>
     </div>
-    <div class="table-responsive">
-      <table class="table table-bordered">
-        <thead>
+    <div class="table-responsive bg-white">
+      <table class="table">
+        <thead class="text-muted">
           <tr>
             <th><%= Spree.t('name') %></th>
             <th><%= Spree.t('amount') %></th>

data/app/views/spree/admin/orders/_form.html.erb

@@ -22,15 +22,6 @@
         order: order,
         title: Spree.t(:order_adjustments) %>
 
-  <% if order.line_items.exists? %>
-    <div class="alert alert-success" id="order-total" data-hook="order_details_total">
-      <%= Spree.t(:order_total) %>:
-      <strong class="order-total">
-        <%= order.display_total %>
-      </strong>
-    </div>
-  <% end %>
-
   <script>
     var order_number = '<%= @order.number %>';
     var order_id = '<%= @order.id %>';