spree_admin 5.2.6 → 5.3.0.rc1

data/app/views/spree/admin/tables/_table_body.html.erb

@@ -0,0 +1,97 @@
+<%# locals: (collection:, columns:, table:, bulk_operations: false, sortable: false) %>
+<% has_bulk_actions = bulk_operations && table.bulk_operations_enabled? %>
+<% has_row_actions = table.row_actions? %>
+<% if has_bulk_actions %>
+  <div data-controller="bulk-operation bulk-dialog" data-action="keydown.esc->bulk-operation#cancel" tabindex="0">
+    <%= form_tag url_for(action: :index), method: :put, data: { 'bulk-operation-target': 'form' } do %>
+      <%= render 'spree/admin/shared/bulk_modal' %>
+      <%= render_bulk_actions_panel(table) %>
+
+      <div class="table-responsive">
+        <table class="table" id="listing_<%= controller_name %>">
+          <thead>
+            <tr>
+              <% if sortable %>
+                <th scope="col" class="w-5 rounded-none"></th>
+              <% end %>
+
+              <th scope="col" class="pr-0 w-5 rounded-none">
+                <%= bulk_operations_select_all_checkbox %>
+              </th>
+
+              <% columns.each do |column| %>
+                <th class="rounded-none" scope="col" class="<%= column_header_class(column) %>">
+                  <%= column.resolve_label %>
+                </th>
+              <% end %>
+
+              <% if has_row_actions %>
+                <th scope="col" class="w-10 rounded-none"></th>
+              <% end %>
+            </tr>
+          </thead>
+          <tbody
+            <% if sortable %>
+              data-controller="sortable"
+              data-sortable-handle-value=".move-handle"
+              data-sortable-resource-name-value="<%= controller_name.singularize %>"
+              data-sortable-response-kind-value="turbo-stream"
+            <% end %>
+          >
+            <%= render partial: 'spree/admin/tables/table_row',
+                       collection: collection,
+                       as: :record,
+                       locals: {
+                         columns: columns,
+                         table: table,
+                         bulk_operations: has_bulk_actions,
+                         sortable: sortable,
+                         row_actions: has_row_actions
+                       } %>
+          </tbody>
+        </table>
+      </div>
+    <% end %>
+  </div>
+<% else %>
+  <div class="table-responsive">
+    <table class="table" id="listing_<%= controller_name %>">
+      <thead>
+        <tr>
+          <% if sortable %>
+            <th scope="col" class="w-5 rounded-none"></th>
+          <% end %>
+
+          <% columns.each do |column| %>
+            <th class="rounded-none" scope="col" class="<%= column_header_class(column) %>">
+              <%= column.resolve_label %>
+            </th>
+          <% end %>
+
+          <% if has_row_actions %>
+            <th scope="col" class="w-10 rounded-none"></th>
+          <% end %>
+        </tr>
+      </thead>
+      <tbody
+        <% if sortable %>
+          data-controller="sortable"
+          data-sortable-handle-value=".move-handle"
+          data-sortable-resource-name-value="<%= controller_name.singularize %>"
+          data-sortable-response-kind-value="turbo-stream"
+        <% end %>
+      >
+        <%= render partial: 'spree/admin/tables/table_row',
+                   collection: collection,
+                   as: :record,
+                   locals: {
+                     columns: columns,
+                     table: table,
+                     bulk_operations: false,
+                     sortable: sortable,
+                     row_actions: has_row_actions
+                   } %>
+      </tbody>
+    </table>
+  </div>
+<% end %>

data/app/views/spree/admin/tables/_table_row.html.erb

@@ -0,0 +1,44 @@
+<%# locals: (record:, columns:, table:, bulk_operations: false, sortable: false, row_actions: true) %>
+<%
+  row_link_url = nil
+  if table.link_to_action == :show && respond_to?(:object_url)
+    row_link_url = object_url(record) rescue nil
+  elsif respond_to?(:edit_object_url)
+    row_link_url = edit_object_url(record) rescue nil
+  end
+%>
+<tr id="<%= dom_id record %>" class="group"<% if sortable %> data-sortable-update-url="<%= object_url(record) %>"<% end %>>
+  <% if sortable %>
+    <td class="w-5 move-handle text-center">
+      <%= icon('grip-vertical', class: 'rounded-md hover:bg-gray-100 p-2 cursor-grab') %>
+    </td>
+  <% end %>
+
+  <% if bulk_operations %>
+    <td class="pr-0 w-5">
+      <%= bulk_operations_checkbox(record) %>
+    </td>
+  <% end %>
+
+  <% columns.each do |column| %>
+    <% if row_link_url %>
+      <td class="<%= column_cell_class(column) %> cursor-pointer"
+          id="<%= dom_id record, column.key %>"
+          data-controller="row-link"
+          data-action="click->row-link#openLink">
+        <%= link_to '', row_link_url, class: 'hidden', data: { row_link_target: 'link', turbo_frame: '_top' } %>
+        <%= render_column_value(record, column, table) %>
+      </td>
+    <% else %>
+      <td class="<%= column_cell_class(column) %>" id="<%= dom_id record, column.key %>">
+        <%= render_column_value(record, column, table) %>
+      </td>
+    <% end %>
+  <% end %>
+
+  <% if row_actions %>
+    <td class="w-10 text-right">
+      <%= render 'spree/admin/tables/row_actions', record: record, table: table %>
+    </td>
+  <% end %>
+</tr>

data/app/views/spree/admin/tables/columns/_gift_card_status.html.erb

@@ -0,0 +1,2 @@
+<%# locals: (record:, column:, value:) %>
+<%= active_badge(record.active?, label: record.display_state) %>

data/app/views/spree/admin/tables/columns/_metafield_definition_display_on.html.erb

@@ -0,0 +1,4 @@
+<%# locals: (record:, column:, value:) %>
+<%= form_with model: record, url: spree.admin_metafield_definition_path(record), method: :patch, data: { controller: 'auto-submit' } do |f| %>
+  <%= f.select :display_on, display_on_options(Spree::MetafieldDefinition), {}, { class: 'form-select form-select-sm', data: { action: 'auto-submit#submit' } } %>
+<% end %>

data/app/views/spree/admin/tables/columns/_newsletter_subscriber_customer.html.erb

@@ -0,0 +1,6 @@
+<%# locals: (record:, column:, value:) %>
+<% if record.user.present? %>
+  <%= render 'spree/admin/shared/user', user: record.user %>
+<% else %>
+  <span class="text-gray-400">-</span>
+<% end %>

data/app/views/spree/admin/tables/columns/_order_payment_state.html.erb

@@ -0,0 +1,2 @@
+<%# locals: (record:, column:, value:) %>
+<%= order_payment_state(record) %>

data/app/views/spree/admin/tables/columns/_order_shipment_state.html.erb

@@ -0,0 +1,2 @@
+<%# locals: (record:, column:, value:) %>
+<%= order_shipment_state(record) %>

data/app/views/spree/admin/tables/columns/_order_stock_locations.html.erb

@@ -0,0 +1,4 @@
+<%# locals: (record:, column:, value:) %>
+<% record.shipments.map(&:stock_location).compact.uniq.each_with_index do |stock_location, index| %>
+  <% if index > 0 %>, <% end %><%= stock_location.name %>
+<% end %>

data/app/views/spree/admin/tables/columns/_price_list_status.html.erb

@@ -0,0 +1 @@
+<%= price_list_status_badge(record) %>

data/app/views/spree/admin/tables/columns/_product_inventory.html.erb

@@ -0,0 +1,3 @@
+<%# locals: (record:, column:, value:) %>
+<% product = record %>
+<%= display_inventory(product) %>

data/app/views/spree/admin/tables/columns/_product_name.html.erb

@@ -0,0 +1,8 @@
+<%# locals: (record:, column:, value:) %>
+<% product = record %>
+<%= link_to edit_object_url(product), class: 'flex items-center gap-3 no-underline', data: { turbo_frame: '_top' } do %>
+  <%= render 'spree/admin/shared/product_image', object: product %>
+  <span class="text-gray-900 font-medium">
+    <%= product.name %>
+  </span>
+<% end %>

data/app/views/spree/admin/tables/columns/_product_status.html.erb

@@ -0,0 +1,4 @@
+<%# locals: (record:, column:, value:) %>
+<% product = record %>
+<%= product_status(product) %>
+<%= help_bubble(Spree.t("admin.products.help_bubble")) %>

data/app/views/spree/admin/tables/columns/_promotion_code.html.erb

@@ -0,0 +1,8 @@
+<%# locals: (record:, column:, value:) %>
+<% if record.coupon_code? && record.code.present? %>
+  <code><%= record.code.upcase %></code>
+<% elsif record.multi_codes? && record.code_prefix.present? %>
+  <code><%= record.code_prefix %>-<%= '*' * 6 %></code>
+<% else %>
+  <span class="text-gray-600 small"><%= Spree.t(:not_available) %></span>
+<% end %>

data/app/views/spree/admin/tables/columns/_promotion_kind.html.erb

@@ -0,0 +1,9 @@
+<%# locals: (record:, column:, value:) %>
+<span class="badge badge-<% if record.automatic? %>info<% else %>light<% end %>">
+  <% if record.automatic? %>
+    <%= icon('automation', class: 'mr-2') %>
+  <% else %>
+    <%= icon('ticket', class: 'mr-2') %>
+  <% end %>
+  <%= record.kind.humanize %>
+</span>

data/app/views/spree/admin/tables/columns/_stock_item_backorderable.html.erb

@@ -0,0 +1,14 @@
+<%# locals: (record:, column:, value:) %>
+<% if can?(:update, record) %>
+  <%= form_for record,
+          url: spree.admin_stock_item_path(record),
+          method: :put,
+          html: { data: { controller: 'auto-submit' }, class: 'flex items-center justify-center' } do |f| %>
+    <div class="custom-control form-checkbox">
+      <%= f.check_box :backorderable, class: 'custom-control-input', id: "stock_item_backorderable_#{record.id}", data: { action: 'auto-submit#submit' } %>
+      <label class="custom-control-label" for="stock_item_backorderable_<%= record.id %>"><span></span></label>
+    </div>
+  <% end %>
+<% else %>
+  <%= active_badge(record.backorderable?) %>
+<% end %>

data/app/views/spree/admin/tables/columns/_stock_item_count_on_hand.html.erb

@@ -0,0 +1,14 @@
+<%# locals: (record:, column:, value:) %>
+<% if can?(:update, record) %>
+  <%= turbo_frame_tag record do %>
+    <%= form_for record,
+                url: spree.admin_stock_item_path(record),
+                method: :put,
+                html: { class: 'flex' } do |f| %>
+      <%= f.number_field :count_on_hand, class: 'form-input mr-2', required: true, min: 0 %>
+      <%= turbo_save_button_tag Spree.t('actions.update'), class: 'btn btn-primary' %>
+    <% end %>
+  <% end %>
+<% else %>
+  <%= record.count_on_hand %>
+<% end %>

data/app/views/spree/admin/tables/columns/_stock_item_location.html.erb

@@ -0,0 +1,6 @@
+<%# locals: (record:, column:, value:) %>
+<% if can?(:manage, record.stock_location) %>
+  <%= link_to record.stock_location.display_name, spree.edit_admin_stock_location_path(record.stock_location), data: { turbo_frame: '_top' } %>
+<% else %>
+  <%= record.stock_location.display_name %>
+<% end %>

data/app/views/spree/admin/tables/columns/_user_location.html.erb

@@ -0,0 +1,2 @@
+<%= customer_location_flag(record) %>
+<%= customer_location(record) %>

data/app/views/spree/admin/tables/columns/_webhook_deliveries_stats.html.erb

@@ -0,0 +1,3 @@
+<%# locals: (record:, column:, value:) %>
+<% endpoint = record %>
+<span class="text-green-500"><%= endpoint.webhook_deliveries.successful.count %></span> / <%= endpoint.webhook_deliveries.count %>

data/app/views/spree/admin/tables/columns/_webhook_delivery_actions.html.erb

@@ -0,0 +1,5 @@
+<%# locals: (record:, column:, value:) %>
+<% delivery = record %>
+<%= link_to icon('eye'), spree.admin_webhook_endpoint_webhook_delivery_path(delivery.webhook_endpoint, delivery),
+        class: 'btn btn-sm btn-light px-2',
+        data: { action: 'drawer#open', turbo_frame: :drawer } %>

data/app/views/spree/admin/tables/columns/_webhook_delivery_status.html.erb

@@ -0,0 +1,2 @@
+<%# locals: (record:, column:, value:) %>
+<%= webhook_delivery_status_badge(record) %>

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

@@ -1,4 +1,4 @@
-<div class="card mb-4">
+<div class="card mb-6">
   <div class="card-body">
 
     <%= f.spree_text_field :name, autofocus: f.object.new_record?, required: true %>

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

@@ -1,4 +1,4 @@
-<div class="card mb-4">
+<div class="card mb-6">
   <div class="card-header">
     <h5 class="card-title">
       <%= Spree.t(:general_settings) %>
@@ -13,7 +13,7 @@
     <%= f.spree_collection_select :zone_id, @available_zones, :id, :name, label: Spree.t(:zone) %>
     <%= f.spree_collection_select :tax_category_id, @available_categories, :id, :name, label: Spree.t(:tax_category) %>
 
-    <hr class="my-4" />
+    <hr class="my-6" />
 
     <%= f.spree_check_box :included_in_price %>
     <%= f.spree_check_box :show_rate_in_label %>

data/app/views/spree/admin/tax_rates/_table_row.html.erb

@@ -1,5 +1,5 @@
 <tr id="<%= spree_dom_id tax_rate %>" data-controller="row-link" class="cursor-pointer">
-  <td class="w-25" data-action="click->row-link#openLink"><%= tax_rate.name %></td>
+  <td class="w-1/4" data-action="click->row-link#openLink"><%= tax_rate.name %></td>
   <td class="w-15" data-action="click->row-link#openLink">
     <%= tax_rate.tax_category.try(:name) || Spree.t(:not_available) %>
   </td>

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

@@ -1,4 +1,4 @@
-<div class="card mb-4">
+<div class="card mb-6">
   <div class="card-body">
     <%= f.spree_text_field :name, required: true, autofocus: true %>
   </div>

data/app/views/spree/admin/taxonomies/_table_row.html.erb

@@ -1,9 +1,9 @@
 <tr id="<%= spree_dom_id taxonomy %>" data-controller="row-link" data-sortable-update-url="<%= spree.admin_taxonomy_path(taxonomy) %>">
   <td class="w-5 move-handle text-center">
-    <%= icon('grip-vertical', class: 'rounded hover-gray p-2') %>
+    <%= icon('grip-vertical', class: 'rounded-md hover:bg-gray-100 p-2') %>
   </td>
-  <td class="w-50 cursor-pointer py-0" data-action="click->row-link#openLink">
-    <%= link_to taxonomy.name, spree.admin_taxonomy_path(taxonomy), class: 'text-decoration-none d-flex align-items-center font-weight-bold text-dark', data: { row_link_target: :link, turbo_frame: '_top' } %>
+  <td class="w-1/2 cursor-pointer py-0" data-action="click->row-link#openLink">
+    <%= link_to taxonomy.name, spree.admin_taxonomy_path(taxonomy), class: 'no-underline flex items-center font-bold text-gray-900', data: { row_link_target: :link, turbo_frame: '_top' } %>
   </td>
   <td class="w-15 cursor-pointer" data-action="click->row-link#openLink">
     <!-- We don't want to include the root taxon -->

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

@@ -1,14 +1,14 @@
-<div class="row" data-controller="slug-form seo-form">
-  <div class="col-lg-8">
-    <div class="card mb-4">
-      <div class="card-body pb-0 pt-3">
+<div class="grid grid-cols-12 gap-6" data-controller="slug-form seo-form">
+  <div class="col-span-12 lg:col-span-8">
+    <div class="card mb-6">
+      <div class="card-body">
         <%= f.spree_text_field :name, required: true, autofocus: @taxon.new_record?, data: { seo_form_target: 'sourceTitleInput', slug_form_target: 'name', action: 'slug-form#updateUrlFromName' } %>
         <%= f.spree_rich_text_area :description, data: { seo_form_target: 'sourceDescriptionInput' } %>
       </div>
     </div>
 
     <% if @taxon.new_record? %>
-      <div class="card mb-4" data-controller="reveal" data-reveal-hidden-class="d-none">
+      <div class="card mb-6" data-controller="reveal" data-reveal-hidden-class="hidden">
         <div class="card-header">
           <h5 class="card-title"><%= Spree.t('admin.taxon_type') %></h5>
         </div>
@@ -16,40 +16,40 @@
           <div class="custom-control custom-radio mb-2">
             <%= f.radio_button :automatic, false, id: 'customRadio1', class: 'custom-control-input', checked: true, data: { action: 'reveal#hide' } %>
             <label class="custom-control-label" for="customRadio1"><%= Spree.t('admin.taxon_types.manual') %></label>
-            <br />
-            <span class="text-muted"><%= Spree.t('admin.taxon_types.manual_info') %></span>
+            <br>
+            <span class="text-gray-600"><%= Spree.t('admin.taxon_types.manual_info') %></span>
           </div>
           <div class="custom-control custom-radio">
             <%= f.radio_button :automatic, true, id: 'customRadio2', class: 'custom-control-input', data: { action: 'reveal#show' } %>
             <label class="custom-control-label" for="customRadio2"><%= Spree.t('admin.taxon_types.automatic') %></label>
-            <br />
-            <span class="text-muted"><%= Spree.t('admin.taxon_types.automatic_info') %></span>
+            <br>
+            <span class="text-gray-600"><%= Spree.t('admin.taxon_types.automatic_info') %></span>
           </div>
         </div>
-        <div class="card-body border-top pt-4 d-none" data-reveal-target="item">
+        <div class="card-body border-t pt-6 hidden" data-reveal-target="item">
           <h6><%= Spree.t(:rules) %></h6>
           <%= render 'spree/admin/taxons/rules_form', f: f %>
         </div>
       </div>
     <% else %>
       <% if @taxon.automatic? %>
-        <div class="card mb-4">
+        <div class="card mb-6">
           <div class="card-header">
             <h5 class="card-title"><%= Spree.t(:rules) %></h5>
           </div>
           <div class="card-body">
-            <div class="alert alert-info mb-3"><%= Spree.t('admin.taxon_types.automatic_info') %></div>
+            <div class="alert alert-info mb-4"><%= Spree.t('admin.taxon_types.automatic_info') %></div>
             <%= render 'spree/admin/taxons/rules_form', f: f %>
           </div>
         </div>
       <% end %>
 
-      <div class="card mb-4">
-        <div class="card-header d-flex align-items-center justify-content-between">
+      <div class="card mb-6">
+        <div class="card-header flex items-center justify-between">
           <h5 class="card-title">
             <%= Spree.t(:products) %>
             <span class="badge badge-info ml-2" id="product_count">
-              <%= @taxon.products.not_archived.count %>
+              <%= @taxon.classification_count %>
             </span>
           </h5>
 
@@ -58,14 +58,15 @@
           <% end %>
         </div>
 
-        <div class="card-body border-bottom pb-0">
-          <div class="d-flex align-items-center">
-            <%= f.spree_select :sort_order, taxon_sort_options_for_select, {}, { class: 'custom-select custom-select-sm w-auto ml-2',  data: { action: 'change->auto-submit#submit' } } %>
+        <div class="card-body border-b py-0">
+          <div class="flex items-center gap-2 py-2">
+            <%= f.label :sort_order, class: 'mb-0' %>
+            <%= f.select :sort_order, taxon_sort_options_for_select, {}, { class: 'form-select form-select-sm ml-2',  data: { action: 'change->auto-submit#submit' } } %>
           </div>
         </div>
 
-        <div class="card-body p-2" style="min-height: 300px">
-          <div class="d-block overflow-y-auto overflow-x-hidden" style="max-height: 300px">
+        <div class="card-body min-h-[300px] p-0">
+          <div class="block overflow-y-auto overflow-x-hidden max-h-[300px]">
             <%= turbo_frame_tag :classifications, src: spree.admin_taxon_classifications_path(@taxon.id), loading: :lazy do %>
               <%= render 'spree/admin/shared/spinner' %>
             <% end %>
@@ -75,8 +76,8 @@
     <% end %>
   </div>
 
-  <div class="col-lg-4">
-    <div class="card mb-4">
+  <div class="col-span-12 lg:col-span-4">
+    <div class="card mb-6">
       <div class="card-header">
         <h5 class="card-title"><%= Spree.t(:images) %></h5>
       </div>
@@ -88,7 +89,7 @@
       </div>
     </div>
 
-    <div class="card mb-4">
+    <div class="card mb-6">
       <div class="card-header">
         <h5 class="card-title">
           <%= Spree.t(:navigation) %>

data/app/views/spree/admin/taxons/_rule_form.html.erb

@@ -1,23 +1,23 @@
-<div class="row nested-form-wrapper border-bottom mb-3 pr-2" data-controller="rule-form" data-new-record="<%= rf.object.new_record? %>">
+<div class="grid grid-cols-12 gap-6 nested-form-wrapper border-b mb-4 pr-2" data-controller="rule-form" data-new-record="<%= rf.object.new_record? %>">
   <% @taxon_rules.each do |taxon_rule| %>
     <template id="rule-form-template-<%= taxon_rule.to_s.demodulize %>" data-rule-form-target="template">
       <%= render "spree/admin/taxons/rule_forms/#{taxon_rule.to_s.demodulize.underscore}", rule_form: rf %>
     </template>
   <% end %>
 
-  <div class="col-lg-4 mb-3">
-    <%= rf.select :type, @rule_types, {}, { class: 'custom-select', data: { action: 'rule-form#replace' } } %>
+  <div class="col-span-12 lg:col-span-4 mb-4">
+    <%= rf.select :type, @rule_types, {}, { class: 'form-select', data: { action: 'rule-form#replace' } } %>
   </div>
-  <div class="col-lg-3 mb-3">
-    <%= rf.select :match_policy, @rule_match_policies, {}, { class: 'custom-select' } %>
+  <div class="col-span-12 lg:col-span-3 mb-4">
+    <%= rf.select :match_policy, @rule_match_policies, {}, { class: 'form-select' } %>
   </div>
-  <div class="col-lg-4 mb-3" data-rule-form-target="value">
+  <div class="col-span-12 lg:col-span-4 mb-4" data-rule-form-target="value">
     <%= render "spree/admin/taxons/rule_forms/#{rf.object.type.demodulize.underscore}", rule_form: rf %>
   </div>
-  <div class="col-lg-1 mb-3 d-flex align-items-center justify-content-center">
-    <button type="button" data-action="nested-form#remove" class="btn btn-sm btn-danger px-2" data-controller="tooltip" aria-label="<%= Spree.t(:remove_condition) %>">
+  <div class="col-span-12 lg:col-span-1 mb-4 flex items-center justify-center">
+    <button type="button" data-action="nested-form#remove" class="btn btn-sm btn-danger px-2 h-full" data-controller="tooltip" aria-label="<%= Spree.t(:remove_condition) %>">
       <%= icon('x', class: 'mr-0') %>
-      <span class="d-lg-none"><%= Spree.t(:remove_condition) %></span>
+      <span class="lg:hidden"><%= Spree.t(:remove_condition) %></span>
       <%= tooltip(Spree.t(:remove_condition)) %>
     </button>
     <%= rf.hidden_field :_destroy if rf.object.persisted? %>

data/app/views/spree/admin/taxons/_rules_form.html.erb

@@ -1,12 +1,12 @@
 <div id="rules-form">
-  <div class="form-group mb-1">
-    <span class="d-block d-lg-inline mb-3"><%= Spree.t('admin.taxon_rules.products_must_match') %></span>
+  <div class="form-group mb-1 flex items-center gap-4 py-4">
+    <span><%= Spree.t('admin.taxon_rules.products_must_match') %></span>
 
-    <div class="custom-control custom-radio custom-control-inline ml-lg-3 mb-3">
+    <div class="custom-control custom-radio">
       <%= f.radio_button :rules_match_policy, :all, class: 'custom-control-input' %>
       <%= f.label :rules_match_policy, Spree.t('admin.taxon_rules.all_conditions'), class: 'custom-control-label', for: :taxon_rules_match_policy_all %>
     </div>
-    <div class="custom-control custom-radio custom-control-inline mb-3">
+    <div class="custom-control custom-radio">
       <%= f.radio_button :rules_match_policy, :any, class: 'custom-control-input' %>
       <%= f.label :rules_match_policy, Spree.t('admin.taxon_rules.any_condition'), class: 'custom-control-label', for: :taxon_rules_match_policy_any %>
     </div>
@@ -24,10 +24,10 @@
     <% end %>
 
     <!-- Inserted elements will be injected before that target. -->
-    <div data-nested-form-target="target" class="mb-2"></div>
+    <div data-nested-form-target="target" class="mb-4"></div>
 
-    <button type="button" class="btn btn-secondary w-100 py-3" data-action="nested-form#add">
-      <%= icon('plus', class: 'mr-2') %>
+    <button type="button" class="btn btn-secondary w-full py-3" data-action="nested-form#add">
+      <%= icon('plus', class: 'mr-4') %>
       <%= Spree.t(:add_one)%>
     </button>
   </div>

data/app/views/spree/admin/taxons/rule_forms/_available_on.html.erb

@@ -1,4 +1,4 @@
-<div class="d-flex align-items-center justify-content-center h-100">
-  <%= rule_form.number_field :value, min: 1, class: 'form-control mr-3' %>
-  <span class="form-text text-nowrap"><%= Spree.t(:days_ago) %></span>
+<div class="flex items-center justify-center h-full">
+  <%= rule_form.number_field :value, min: 1, class: 'form-input mr-6' %>
+  <span class="form-text whitespace-nowrap"><%= Spree.t(:days_ago) %></span>
 </div>

data/app/views/spree/admin/taxons/rule_forms/_sale.html.erb

@@ -1,4 +1,4 @@
-<div class="d-flex align-items-center justify-content-center h-100">
+<div class="flex items-center justify-center h-full">
   <span class="badge badge-success"><%= Spree.t(:true_label) %></span>
   <%= rule_form.hidden_field :value, value: true %>
 </div>

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

@@ -27,9 +27,9 @@
     <% end %>
   <% else %>
     <div class="drawer-body">
-      <div class="text-muted p-5 d-flex align-items-center w-100 justify-content-center flex-column">
-        <%= icon 'language', class: 'mb-3 opacity-50', style: 'font-size: 2rem;' %>
-        <p class="text-center"><%= Spree.t('admin.translations.no_translations_configured') %></p>
+      <div class="text-gray-600 p-12 flex items-center w-full justify-center flex-col">
+        <%= icon 'language', class: 'mb-5 opacity-50 text-4xl' %>
+        <p class="text-center mb-3"><%= Spree.t('admin.translations.no_translations_configured') %></p>
 
         <% if can?(:edit, current_store) %>
           <%= link_to_with_icon 'settings', Spree.t('admin.translations.configure_store'), spree.edit_admin_store_path(section: 'general-settings'), class: 'btn btn-primary', data: { 'turbo-frame': '_top' } %>

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

@@ -5,7 +5,7 @@
 <% end %>
 
 <% if resource.option_values.any? %>
-  <tr class="bg-light">
+  <tr class="bg-gray-25">
     <th colspan="3"><%= Spree.t(:option_values) %></th>
   </tr>
 
@@ -14,7 +14,7 @@
       <tr>
         <td><%= Spree.t(field) %></td>
         <td><%= ff.object.send(field) %></td>
-        <td><%= ff.text_field "#{field}_#{locale}", class: 'form-control' %></td>
+        <td><%= ff.text_field "#{field}_#{locale}", class: 'form-input' %></td>
       </tr>
     <% end %>
   <% end %>

data/app/views/spree/admin/translations/products/_form.html.erb

@@ -11,4 +11,4 @@
   <% end %>
 <% end %>
 
-<div class="pb-5"></div>
+<div class="pb-12"></div>

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

@@ -1,21 +1,21 @@
 <% content_for(:title, Spree.t(:forgot_password)) %>
 
-<h1 class="mb-3 font-weight-light"><%= Spree.t(:change_password) %></h1>
+<h1 class="mb-4 font-light"><%= Spree.t(:change_password) %></h1>
 <%= form_for(resource, as: resource_name, url: password_path(:admin_user), html: { method: :put }, data: { turbo_frame: :_top, turbo: false }) do |f| %>
   <%= render partial: 'spree/admin/shared/error_messages', locals: { target: resource } %>
   <%= f.hidden_field :reset_password_token %>
-  <div class="form-group mb-3">
+  <div class="form-group mb-4">
     <%= f.label :password, Spree.t(:password), required: true, class: 'form-label' %>
     <% if @minimum_password_length %>
       <em>(<%= @minimum_password_length %> characters minimum)</em>
     <% end %>
-    <%= f.password_field :password, autofocus: true, autocomplete: "new-password", class: 'form-control form-control-lg rounded-sm', min: @minimum_password_length %>
+    <%= f.password_field :password, autofocus: true, autocomplete: "new-password", class: 'form-input form-input-lg', min: @minimum_password_length %>
   </div>
-  <div class="form-group mb-3">
+  <div class="form-group mb-4">
     <%= f.label :password_confirmation, Spree.t(:confirm_password), required: true, class: 'form-label' %>
-    <%= f.password_field :password_confirmation, autocomplete: "new-password", class: 'form-control form-control-lg rounded-sm', min: @minimum_password_length %>
+    <%= f.password_field :password_confirmation, autocomplete: "new-password", class: 'form-input form-input-lg', min: @minimum_password_length %>
   </div>
   <%= render 'spree/admin/shared/devise/links', f: f %>
-  <%= turbo_save_button_tag Spree.t(:reset_password), class: 'btn btn-primary btn-lg w-100' %>
+  <%= turbo_save_button_tag Spree.t(:reset_password), class: 'btn btn-primary btn-lg w-full' %>
 <% end %>
 

data/app/views/spree/admin/user_passwords/new.html.erb

@@ -1,12 +1,12 @@
 <% content_for(:title, Spree.t(:forgot_password)) %>
 
-<h1 class="mb-3 font-weight-light"><%= Spree.t(:forgot_password) %></h1>
+<h1 class="mb-4 font-light"><%= Spree.t(:forgot_password) %></h1>
 <%= form_for(resource, as: resource_name, url: password_path(:admin_user), data: { turbo_frame: :_top }) do |f| %>
-  <div class="form-group mb-3">
+  <div class="form-group mb-4">
     <%= f.label :email, Spree.t(:email), required: true, class: 'form-label' %>
-    <%= f.email_field :email, required: true, class: 'form-control form-control-lg rounded-sm', placeholder: 'steve@apple.com', data: { enable_button_target: :input }, autocomplete: :email, autofocus: true %>
+    <%= f.email_field :email, required: true, class: 'form-input form-input-lg', placeholder: 'steve@apple.com', data: { enable_button_target: :input }, autocomplete: :email, autofocus: true %>
   </div>
   <%= render 'spree/admin/shared/devise/links', f: f %>
-  <%= turbo_save_button_tag Spree.t(:reset_password), class: 'btn btn-primary btn-lg w-100' %>
+  <%= turbo_save_button_tag Spree.t(:reset_password), class: 'btn btn-primary btn-lg w-full' %>
 <% end %>