blacklight-spotlight 3.6.0.beta9 → 4.0.0

data/app/views/spotlight/pages/_view_type_group.html.erb

@@ -1,7 +1,7 @@
 <% views = blacklight_view_config_for_search_block(block) %>
 <% if views.length > 1 -%>
 <div class="view-type">
-  <span class="sr-only"><%= t('blacklight.search.view_title') %></span>
+  <span class="sr-only visually-hidden"><%= t('blacklight.search.view_title') %></span>
   <div class="view-type-group btn-group">
     <% views.each do |view, config| %>
       <%= link_to url_for(search_state.to_h.merge(view: view)), :title => t("blacklight.search.view_title.#{view}", default: t("blacklight.search.view.#{view}", default: blacklight_config.view[view].title)), :class => "btn btn-outline-secondary view-type-#{ view.to_s.parameterize } #{"active" if block_document_index_view_type(block) == view}" do %>

data/app/views/spotlight/resources/_external_resources_form.html.erb

@@ -12,6 +12,7 @@
               class: "nav-link #{"active" if i == 0}",
               role: 'tab',
               'data-toggle' => 'tab',
+              'data-bs-toggle' => 'tab',
               'aria-controls' => "external_resource_tab_#{i}"
             )
         %>

data/app/views/spotlight/resources/_form.html.erb

@@ -2,7 +2,7 @@
   <%= f.text_field :url  %>
   <div class="form-actions">
     <div class="primary-actions">
-      <%= cancel_link @resource, :back, class: 'btn-sizing' %>
+      <%= cancel_link @resource, :back, class: 'btn btn-link', role: 'button' %>
       <%= f.submit t('.add_item'), class: 'btn btn-primary' %>
     </div>
   </div>

data/app/views/spotlight/resources/csv_upload/_form.html.erb

@@ -2,7 +2,7 @@
   <%= f.url_field :url, type: "file", help: t('.help_html', link: link_to(t('.template'), template_exhibit_resources_csv_uploads_path)), label: t('.file_label') %>
   <div class="form-actions">
     <div class="primary-actions">
-      <%= cancel_link @resource, :back, class: 'btn-sizing' %>
+      <%= cancel_link @resource, :back, class: 'btn btn-link', role: 'button' %>
       <%= f.submit t('.add_item'), class: 'btn btn-primary' %>
     </div>
   </div>

data/app/views/spotlight/resources/iiif/_form.html.erb

@@ -2,7 +2,7 @@
   <%= f.text_field :url, help: t('.url-field.help'), label: t('.manifest') %>
   <div class="form-actions">
     <div class="primary-actions">
-      <%= cancel_link @resource, :back, class: 'btn-sizing' %>
+      <%= cancel_link @resource, :back, class: 'btn btn-link', role: 'button' %>
       <%= f.submit t('.add_item'), class: 'btn btn-primary' %>
     </div>
   </div>

data/app/views/spotlight/resources/json_upload/_form.html.erb

@@ -3,7 +3,7 @@
     <%= f.url_field :json, type: "file", label: t('.file_label') %>
     <div class="form-actions">
       <div class="primary-actions">
-        <%= cancel_link @resource, :back, class: 'btn-sizing' %>
+        <%= cancel_link @resource, :back, class: 'btn btn-link', role: 'button' %>
         <%= f.submit t('.add_item'), class: 'btn btn-primary' %>
       </div>
     </div>

data/app/views/spotlight/resources/new.html.erb

@@ -13,6 +13,7 @@
                     role: 'tab',
                     class: "nav-link #{"active" if @tab == tab_name}",
                     'data-toggle' => 'tab',
+                    'data-bs-toggle' => 'tab',
                     'aria-controls' => "#{tab_name}" %>
       </li>
     <% end %>

data/app/views/spotlight/resources/upload/_form.html.erb

@@ -12,7 +12,7 @@
   <div class="form-actions">
     <div class="primary-actions">
       <%= hidden_field_tag :tab, 'upload', id: nil %>
-      <%= cancel_link @resource, :back, class: 'btn-sizing' %>
+      <%= cancel_link @resource, :back, class: 'btn btn-link', role: 'button' %>
       <%= f.submit t('.add_item_and_continue'), name: 'add-and-continue', class: 'btn btn-secondary' %>
       <%= f.submit t('.add_item'), class: 'btn btn-primary' %>
     </div>

data/app/views/spotlight/roles/index.html.erb

@@ -18,7 +18,7 @@
           <td></td>
           <td colspan=2>
             <div class="form-actions d-flex justify-content-end">
-              <%= cancel_link r.object, '#', class: 'btn-sizing', data: {behavior: 'cancel-edit' } %>
+              <%= cancel_link r.object, '#', class: 'btn btn-link', role: 'button', data: { behavior: 'cancel-edit' } %>
               <%=f.submit nil, class: 'btn btn-primary'%>
             </div>
           </td>
@@ -27,11 +27,11 @@
         <tr data-show-for="<%= r.object.id %>" class="<%= 'invite-pending' if r.object.user.invite_pending? %>">
           <td>
             <%= r.object.user.to_s %>
-            <span class='badge badge-warning pending-label'><%= t('.invite_pending') %></span>
+            <span class='badge badge-warning bg-warning pending-label'><%= t('.invite_pending') %></span>
           </td>
           <td><%= r.object.role.humanize %></td>
           <td>
-            <%= link_to "#", data: {behavior: 'edit-user', target: r.object.id } do %>
+            <%= link_to "#", data: { behavior: 'edit-user', target: r.object.id } do %>
               <%= blacklight_icon('edit') %>
             <% end %>
           </td>
@@ -43,7 +43,7 @@
           </td>
           <td colspan=2>
             <div class="form-actions d-flex justify-content-end">
-              <%= cancel_link r.object, '#', class: 'btn-sizing', data: {behavior: 'cancel-edit' } %>
+              <%= cancel_link r.object, '#', class: 'btn btn-link', role: 'button', data: { behavior: 'cancel-edit' } %>
               <%=f.submit nil, class: 'btn btn-primary'%>
             </div>
           </td>

data/app/views/spotlight/search_configurations/_default_per_page.html.erb

@@ -1,4 +1,4 @@
-<%= f.form_group :default_per_page, label: { text: t(:'.label'), class: 'pt-0'} do %>
+<%= f.form_group :default_per_page, label: { text: t(:'.label'), class: 'pt-0 col-md-3 text-md-right text-md-end' } do %>
   <% @blacklight_configuration.default_blacklight_config.per_page.each do |key| %>
     <%= f.radio_button :default_per_page, key, label: key.to_s %>
   <% end %>

data/app/views/spotlight/search_configurations/_document_index_view_types.html.erb

@@ -1,7 +1,12 @@
-<%= f.form_group :document_index_view_types, label: {text: t(:'.label'), class: 'pt-0'} do %>
+<%= f.form_group :document_index_view_types, label: { text: t(:'.label'), class: 'pt-0 col-md-3 text-md-right text-md-end' } do %>
   <%= f.fields_for :document_index_view_types, @blacklight_configuration.document_index_view_types_selected_hash do |vt| %>
     <% @blacklight_configuration.default_blacklight_config.view.select { |_k, v| v.if != false }.each do |key, view| %>
-      <%= vt.check_box key, label: view.display_label %>
+      <div class="row">
+        <div class="col">
+          <%= vt.check_box_without_bootstrap key %>
+          <%= vt.label key, label: view.display_label %>
+        </div>
+      </div>
     <% end %>
   <% end %>
 <% end %>

data/app/views/spotlight/search_configurations/_facets.html.erb

@@ -15,7 +15,7 @@
                 <% end %>
               </div>
             <% when :additional_options  %>
-              <div class="facet-metadata mr-3">
+              <div class="facet-metadata mr-3 me-3">
                 <%= render partial: 'facet_metadata', locals: { blacklight_config: @blacklight_configuration.blacklight_config, field_config: config, metadata: metadata } %>
               </div>
             <% else %>

data/app/views/spotlight/search_configurations/edit.html.erb

@@ -8,13 +8,13 @@
   <div role="tabpanel">
     <ul class="nav nav-tabs" role="tablist">
       <li role="presentation" class="nav-item">
-        <a href="#options" aria-controls="options" role="tab" data-toggle="tab" class="nav-link active"><%= t(:'.tab.options') %></a>
+        <a href="#options" aria-controls="options" role="tab" data-toggle="tab" data-bs-toggle="tab" class="nav-link active"><%= t(:'.tab.options') %></a>
       </li>
       <li role="presentation" class="nav-item">
-        <a href="#facets" aria-controls="facets" role="tab" data-toggle="tab" class="nav-link"><%= t(:'.tab.facets') %></a>
+        <a href="#facets" aria-controls="facets" role="tab" data-toggle="tab" data-bs-toggle="tab" class="nav-link"><%= t(:'.tab.facets') %></a>
       </li>
       <li role="presentation" class="nav-item">
-        <a href="#results" aria-controls="results" role="tab" data-toggle="tab" class="nav-link"><%= t(:'.tab.results') %></a>
+        <a href="#results" aria-controls="results" role="tab" data-toggle="tab" data-bs-toggle="tab" class="nav-link"><%= t(:'.tab.results') %></a>
       </li>
     </ul>
     <div class="tab-content">

data/app/views/spotlight/searches/_form.html.erb

@@ -13,19 +13,19 @@
   <div role="tabpanel">
     <ul class="nav nav-tabs" role="tablist">
       <li role="presentation" class="nav-item">
-        <a href="#search-description" aria-controls="search-description" role="tab" data-toggle="tab" class="nav-link active"><%= t(:'.search_description') %></a>
+        <a href="#search-description" aria-controls="search-description" role="tab" data-toggle="tab" data-bs-toggle="tab" class="nav-link active"><%= t(:'.search_description') %></a>
       </li>
 
       <li role="presentation" class="nav-item">
-        <a href="#search-group" aria-controls="search-group" role="tab" data-toggle="tab" class="nav-link"><%= t(:'.search_group') %></a>
+        <a href="#search-group" aria-controls="search-group" role="tab" data-toggle="tab" data-bs-toggle="tab" class="nav-link"><%= t(:'.search_group') %></a>
       </li>
 
       <li role="presentation" class="nav-item">
-        <a href="#search-masthead" aria-controls="search-masthead" role="tab" data-toggle="tab" class="nav-link"><%= t(:'.search_masthead') %></a>
+        <a href="#search-masthead" aria-controls="search-masthead" role="tab" data-toggle="tab" data-bs-toggle="tab" class="nav-link"><%= t(:'.search_masthead') %></a>
       </li>
 
       <li role="presentation" class="nav-item">
-        <a href="#search-thumbnail" aria-controls="search-thumbnail" role="tab" data-toggle="tab" class="nav-link"><%= t(:'.search_thumbnail') %></a>
+        <a href="#search-thumbnail" aria-controls="search-thumbnail" role="tab" data-toggle="tab" data-bs-toggle="tab" class="nav-link"><%= t(:'.search_thumbnail') %></a>
       </li>
     </ul>
 
@@ -44,7 +44,7 @@
           <% end %>
         <% end %>
         <% unless @search.query_params.blank? %>
-          <div class="form-group row">
+          <div class="form-group mb-3 row">
             <label class="col-md-2 col-sm-2 col-form-label"><%= t(:".query_params") %></label>
             <div class="col-md-7 col-sm-7">
               <div class="appliedParams card card-body bg-light d-block">
@@ -81,7 +81,7 @@
 
   <div class="form-actions">
     <div class="primary-actions">
-      <%= cancel_link @search,exhibit_searches_path(@exhibit), class: 'btn-sizing' %>
+      <%= cancel_link @search,exhibit_searches_path(@exhibit), class: 'btn btn-link', role: 'button' %>
       <%= f.submit nil, class: 'btn btn-primary' %>
     </div>
   </div>

data/app/views/spotlight/searches/index.html.erb

@@ -15,11 +15,11 @@
   <div role="tabpanel">
     <ul class="nav nav-tabs" role="tablist">
       <li role="presentation" class="nav-item">
-        <a href="#browse-categories" aria-controls="browse-categories" role="tab" data-toggle="tab" class="nav-link active"><%= t(:'.categories_header') %></a>
+        <a href="#browse-categories" aria-controls="browse-categories" role="tab" data-toggle="tab" data-bs-toggle="tab" class="nav-link active"><%= t(:'.categories_header') %></a>
       </li>
 
       <li role="presentation" class="nav-item">
-        <a href="#browse-groups" aria-controls="browse-groups" role="tab" data-toggle="tab" class="nav-link"><%= t(:'.groups_header') %></a>
+        <a href="#browse-groups" aria-controls="browse-groups" role="tab" data-toggle="tab" data-bs-toggle="tab" class="nav-link"><%= t(:'.groups_header') %></a>
       </li>
     </ul>
     <div class="tab-content">
@@ -40,7 +40,7 @@
             </ol>
           </div>
 
-          <div class="float-right">
+          <div class="float-right float-end">
             <%= submit_tag t(:'helpers.action.update_all'), class: "btn btn-primary" %>
           </div>
         <% end %>
@@ -57,7 +57,7 @@
             </ol>
           </div>
 
-          <div class="float-right">
+          <div class="float-right float-end">
             <%= submit_tag t(:'helpers.action.update_all'), class: "btn btn-primary" %>
           </div>
         <% end %>

data/app/views/spotlight/shared/_dd3_item.html.erb

@@ -22,7 +22,7 @@
           <div class="flex-grow-1 align-self-center">
             <h3 class="h6 card-title mb-0">
               <%= field.hidden_field :weight, value: index, 'data-property' => 'weight' %>
-              <%= field.check_box enabled_method, inline: true, checked: field.object.public_send(enabled_method), hide_label: true, title: label %>
+              <%= field.check_box_without_bootstrap enabled_method, class: 'mr-3 me-3', checked: field.object.public_send(enabled_method), hide_label: true, title: label %>
               <span class="d-inline-block w-75" data-in-place-edit-target=".edit-in-place" data-in-place-edit-field-target="[data-edit-field-target='true']">
                 <a href="#edit-in-place" class="field-label edit-in-place"><%= label %></a>
                 <%= field.hidden_field label_method, value: label, class: 'form-control form-control-sm title-field', data: {:"edit-field-target" => 'true', default_value: default_value } %>
@@ -42,7 +42,7 @@
 
       <% if additional_content.present? %>
         <div class="d-flex">
-          <button class="btn btn-link collapse-toggle collapsed" type="button" data-toggle="collapse" data-target="#<%= id.parameterize %>_options" aria-expanded="false" aria-controls="<%= id.parameterize %>_options">
+          <button class="btn btn-link collapse-toggle collapsed" type="button" data-toggle="collapse" data-bs-toggle="collapse" data-target="#<%= id.parameterize %>_options" data-bs-target="#<%= id.parameterize %>_options" aria-expanded="false" aria-controls="<%= id.parameterize %>_options">
             Options
           </button>
           <span class="collapse-chevron">❯</span>

data/app/views/spotlight/shared/_exhibit_sidebar.html.erb

@@ -1,4 +1,4 @@
-<h2 class="sr-only"><%= t(:'.header') %></h2>
+<h2 class="sr-only visually-hidden"><%= t(:'.header') %></h2>
 <ul class="nav sidenav top-level flex-column">
   <%= nav_link t(:'spotlight.curation.sidebar.dashboard'), spotlight.exhibit_dashboard_path(current_exhibit) %>
   <% if current_exhibit.analytics_provider&.enabled? %>

data/app/views/spotlight/shared/_locale_picker.html.erb

@@ -1,6 +1,6 @@
 <% if current_exhibit && current_exhibit.languages.accessible_by(current_ability).any? %>
   <li class="nav-item dropdown">
-    <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
+    <a class="nav-link dropdown-toggle" data-toggle="dropdown" data-bs-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
       <%= Spotlight::Language.new(locale: I18n.locale).to_native %>
     </a>
     <ul class="dropdown-menu">

data/app/views/spotlight/shared/_report_a_problem.html.erb

@@ -12,7 +12,7 @@
       <div class="form-actions row">
         <div class="col offset-sm-3">
           <%= f.submit nil, class: 'btn btn-primary' %>
-          <%= link_to t(:'helpers.action.cancel'), '#', class: 'btn-sizing', data: { 'behavior' => 'cancel-link' } %>
+          <%= link_to t(:'helpers.action.cancel'), '#', class: 'btn btn-link', role: 'button', data: { 'behavior' => 'cancel-link' } %>
         </div>
       </div>
     <% end %>

data/app/views/spotlight/sir_trevor/blocks/_browse_group_categories_block.html.erb

@@ -4,12 +4,12 @@
       <div class="d-flex flex-column flex-md-row py-2">
         <div class="d-flex justify-content-between align-items-baseline">
           <h2 class="m-0"><%= group.title %></h2>
-          <div class="pl-3">
+          <div class="pl-3 ps-3">
             <%= link_to t(:'.view_all'), exhibit_browse_groups_path(current_exhibit, group) %>
           </div>
         </div>
         <% if group.searches.count > 1 %>
-          <ul class="browse-group-categories-controls p-0 pt-2 pt-md-0 ml-md-auto mb-0 d-flex justify-content-center align-items-end">
+          <ul class="browse-group-categories-controls p-0 pt-2 pt-md-0 ml-md-auto ms-md-auto mb-0 d-flex justify-content-center align-items-end">
             <li class="prev px-1 overflow-hidden">
               <%= blacklight_icon 'arrow-alt-circle-left' %>
             </li>

data/app/views/spotlight/sir_trevor/blocks/_oembed_block.html.erb

@@ -1,5 +1,5 @@
 <div class="content-block item-text row d-block clearfix">
-  <div class="<%= 'col-md-6' if oembed_block.text? %> col-12 <%= oembed_block.content_align == 'right' ? 'float-right' : 'float-left' %> oembed-block">
+  <div class="<%= 'col-md-6' if oembed_block.text? %> col-12 <%= oembed_block.content_align == 'right' ? 'float-right float-end' : 'float-left float-start' %> oembed-block">
     <%= render_oembed_tag oembed_block.url %>
   </div>
 

data/app/views/spotlight/sir_trevor/blocks/_search_results_block.html.erb

@@ -11,7 +11,7 @@
       <% views = blacklight_view_config_for_search_block(search_results_block) %>
       <% if views.length > 1 -%>
       <div id="sortAndPerPage" class="clearfix my-3" role="navigation" aria-label="<%= t('blacklight.search.per_page.aria_label', default: 'Results navigation')%>">
-        <div class="search-widgets float-right">
+        <div class="search-widgets float-right float-end">
           <%= render partial: 'view_type_group', locals: { block: search_results_block } %>
         </div>
       </div>

data/app/views/spotlight/sir_trevor/blocks/_solr_documents_block.html.erb

@@ -3,7 +3,7 @@
 <div class="content-block items-block row d-block clearfix">
   <% if solr_documents_block.documents? %>
 
-    <div class="items-col spotlight-flexbox <%= solr_documents_block.text? ? "col-md-6" : "col-md-12" %> <%= solr_documents_block.content_align == 'right' ? 'float-right' : 'float-left' %>">
+    <div class="items-col spotlight-flexbox <%= solr_documents_block.text? ? "col-md-6" : "col-md-12" %> <%= solr_documents_block.content_align == 'right' ? 'float-right float-end' : 'float-left float-start' %>">
       <% solr_documents_block.each_document do |block_options, document| %>
         <% doc_presenter = document_presenter(document) %>
         <div class="box" data-id="<%= document.id %>">

data/app/views/spotlight/sir_trevor/blocks/_solr_documents_carousel_block.html.erb

@@ -3,7 +3,7 @@
 <% html_id = "carousel-#{solr_documents_carousel_block.object_id}" %>
 <div class="content-block carousel-block carousel-height-<%= solr_documents_carousel_block.max_height %>">
 <% if solr_documents_carousel_block.documents? %>
-  <div id="<%= html_id %>" class="carousel slide" data-ride="carousel"  data-interval="<%= solr_documents_carousel_block.interval %>">
+  <div id="<%= html_id %>" class="carousel slide" data-ride="carousel" data-interval="<%= solr_documents_carousel_block.interval %>" <%= "data-bs-ride=carousel data-bs-interval=#{solr_documents_carousel_block.interval}" if solr_documents_carousel_block.autoplay? %>>
     <div class="carousel-inner text-center">
     <% solr_documents_carousel_block.each_document.each_with_index do |(block_options, document), index| %>
       <% doc_presenter = document_presenter(document) %>
@@ -29,7 +29,7 @@
         </div>
       </div>
       <% indicators << capture do %>
-        <li data-target="#<%= html_id %>" data-slide-to="<%= index %>" class="<%= 'active' if index == 0 %>"></li>
+        <li data-target="#<%= html_id %>" data-bs-target="#<%= html_id %>" data-slide-to="<%= index %>" data-bs-slide-to="<%= index %>" class="<%= 'active' if index == 0 %>"></li>
       <% end %>
     <% end %>
     </div>
@@ -40,10 +40,10 @@
     </ol>
 
     <!-- Controls -->
-    <a class="left carousel-control-prev" href="#<%= html_id %>" data-slide="prev">
+    <a class="left carousel-control-prev" href="#<%= html_id %>" data-slide="prev" data-bs-slide="prev">
       <%= blacklight_icon('arrow_back_ios') %>
     </a>
-    <a class="right carousel-control-next" href="#<%= html_id %>" data-slide="next">
+    <a class="right carousel-control-next" href="#<%= html_id %>" data-slide="next" data-bs-slide="next">
       <%= blacklight_icon('arrow_forward_ios') %>
     </a>
   </div>

data/app/views/spotlight/sir_trevor/blocks/_solr_documents_embed_block.html.erb

@@ -3,7 +3,7 @@
 <div class="content-block items-block row d-block clearfix">
 
   <% if solr_documents_embed_block.documents? %>
-    <div class="items-col <%= solr_documents_embed_block.text? ? "col-md-6" : "col-md-12" %> <%= solr_documents_embed_block.content_align == 'right' ? 'float-right' : 'float-left' %>">
+    <div class="items-col <%= solr_documents_embed_block.text? ? "col-md-6" : "col-md-12" %> <%= solr_documents_embed_block.content_align == 'right' ? 'float-right float-end' : 'float-left float-start' %>">
       <% unless solr_documents_embed_block.text? %>
         <% unless solr_documents_embed_block.title.blank? %>
 

data/app/views/spotlight/sir_trevor/blocks/_solr_documents_features_block.html.erb

@@ -4,7 +4,7 @@
 
 <div class="content-block carousel-block item-features">
   <% if solr_documents_features_block.documents? %>
-    <div id="<%= html_id %>" class="carousel" data-ride="carousel"  data-interval="false">
+    <div id="<%= html_id %>" class="carousel" data-ride="carousel" data-interval="false">
       <div class="row">
         <div class="col-sm-6">
           <div class="carousel-inner">
@@ -21,7 +21,7 @@
               </div>
 
               <% indicators << capture do %>
-                <li data-target="#<%= html_id %>" data-slide-to="<%= index %>" class="list-group-item <%= 'active' if index == 0 %>">
+                <li data-target="#<%= html_id %>" data-bs-target="#<%= html_id %>" data-slide-to="<%= index %>" data-bs-slide-to="<%= index %>" class="list-group-item <%= 'active' if index == 0 %>">
                   <% caption_text = solr_documents_features_block.document_caption(doc_presenter, solr_documents_features_block.primary_caption_field, default: Spotlight::PageConfigurations::DOCUMENT_TITLE_KEY) %>
 
                   <a href="#" title="<%= caption_text %>">

data/app/views/spotlight/sir_trevor/blocks/_solr_documents_grid_block.html.erb

@@ -1,6 +1,6 @@
 <% solr_documents_grid_block.with_solr_helper(self) %>
 <div class="content-block item-grid-block row d-block clearfix">
-  <div class="items-col align-content-start justify-content-between flex-wrap <%= solr_documents_grid_block.text? ? 'col-md-9' : 'col-md-12' %> <%= solr_documents_grid_block.content_align == 'right' ? 'float-right' : 'float-left' %>">
+  <div class="items-col align-content-start justify-content-between flex-wrap <%= solr_documents_grid_block.text? ? 'col-md-9' : 'col-md-12' %> <%= solr_documents_grid_block.content_align == 'right' ? 'float-right float-end' : 'float-left float-start' %>">
     <% if solr_documents_grid_block.documents? %>
         <% solr_documents_grid_block.each_document.each_with_index do |(block_options, document), index| %>
           <% doc_presenter = document_presenter(document) %>

data/app/views/spotlight/sir_trevor/blocks/_uploaded_items_block.html.erb

@@ -1,5 +1,5 @@
 <div class="content-block item-text row d-block clearfix">
-  <div class="items-col spotlight-flexbox <%= 'col-md-6' if uploaded_items_block.text? %> col-12 <%= uploaded_items_block.content_align == 'right'  ? 'float-right' : 'float-left'  %> uploaded-items-block">
+  <div class="items-col spotlight-flexbox <%= 'col-md-6' if uploaded_items_block.text? %> col-12 <%= uploaded_items_block.content_align == 'right'  ? 'float-right float-end' : 'float-left float-start'  %> uploaded-items-block">
     <% if uploaded_items_block.files.present? %>
       <% uploaded_items_block.files.each do |file| %>
         <div class="box" data-id="<%= file[:id] %>">

data/app/views/spotlight/sites/_exhibit.html.erb

@@ -11,8 +11,8 @@
      </div>
 
   </td>
-  <td class="text-right"><%= exhibit.published? ? t(:'.published') : t(:'.unpublished') %></td>
-  <td class="text-right"><%= exhibit.requested_by %></td>
-  <td class="text-right"><%= l exhibit.created_at, format: :long %></td>
-  <td class="text-right"><%= l exhibit.updated_at, format: :long %></td>
+  <td class="text-right text-end"><%= exhibit.published? ? t(:'.published') : t(:'.unpublished') %></td>
+  <td class="text-right text-end"><%= exhibit.requested_by %></td>
+  <td class="text-right text-end"><%= l exhibit.created_at, format: :long %></td>
+  <td class="text-right text-end"><%= l exhibit.updated_at, format: :long %></td>
 </tr>

data/app/views/spotlight/sites/edit.html.erb

@@ -3,10 +3,10 @@
   <%= bootstrap_form_for @site, url: spotlight.site_path, layout: :horizontal, label_col: 'col-md-2', control_col: 'col-md-10' do |f| %>
     <ul class="nav nav-tabs" role="tablist">
       <li role="presentation" class="nav-item">
-        <a href="#basic" class="active nav-link" aria-controls="basic" role="tab" data-toggle="tab"><%= t(:'.basic_settings.heading') %></a>
+        <a href="#basic" class="active nav-link" aria-controls="basic" role="tab" data-toggle="tab" data-bs-toggle="tab"><%= t(:'.basic_settings.heading') %></a>
       </li>
       <li role="presentation" class="nav-item">
-        <a href="#site-masthead" class="nav-link" aria-controls="site-masthead" role="tab" data-toggle="tab"><%= t(:'.site_masthead.heading') %></a>
+        <a href="#site-masthead" class="nav-link" aria-controls="site-masthead" role="tab" data-toggle="tab" data-bs-toggle="tab"><%= t(:'.site_masthead.heading') %></a>
       </li>
     </ul>
     <div class="tab-content">

data/app/views/spotlight/sites/edit_exhibits.html.erb

@@ -5,10 +5,10 @@
     <thead>
       <tr>
         <th><%= Spotlight::Exhibit.human_attribute_name(:title) %></th>
-        <th class="text-right"><%= Spotlight::Exhibit.human_attribute_name(:published)  %></th>
-        <th class="text-right"><%= Spotlight::Exhibit.human_attribute_name(:requested_by) %></th>
-        <th class="text-right"><%= Spotlight::Exhibit.human_attribute_name(:created_at)  %></th>
-        <th class="text-right"><%= Spotlight::Exhibit.human_attribute_name(:updated_at)  %></th>
+        <th class="text-right text-end"><%= Spotlight::Exhibit.human_attribute_name(:published)  %></th>
+        <th class="text-right text-end"><%= Spotlight::Exhibit.human_attribute_name(:requested_by) %></th>
+        <th class="text-right text-end"><%= Spotlight::Exhibit.human_attribute_name(:created_at)  %></th>
+        <th class="text-right text-end"><%= Spotlight::Exhibit.human_attribute_name(:updated_at)  %></th>
       </tr>
     </thead>
     <tbody class="table metadata_fields dd dd-list" data-behavior="nestable" data-max-depth="1" data-list-node-name="tbody" data-item-node-name="tr" data-expand-btn-HTML=" " data-collapse-btn-HTML=" ">

data/app/views/spotlight/tags/index.html.erb

@@ -16,7 +16,7 @@
       </ul>
     <% end %>
 
-    <div class="float-right">
+    <div class="float-right float-end">
       <%= submit_tag t(:'helpers.action.update_all'), class: "btn btn-primary" %>
     </div>
   <% end %>

data/app/views/spotlight/translations/_browse_categories.html.erb

@@ -4,7 +4,7 @@
     <%= hidden_field_tag :language, @language %>
     <%= hidden_field_tag :tab, 'browse', id: nil %>
     <div class="row">
-      <div class="col-4 text-right">
+      <div class="col-4 text-right text-end">
         <span class="browse-translations-header">
           <%= t :'.default_language_column_label' %>
         </span>
@@ -21,7 +21,7 @@
       <%= f.fields_for :translations, title_translation do |translation_fields| %>
         <%= translation_fields.hidden_field :key %>
         <%= translation_fields.hidden_field :locale %>
-        <div data-translation-progress-item="true" class="row form-group browse-category-title">
+        <div data-translation-progress-item="true" class="row form-group mb-3 browse-category-title">
           <%= translation_fields.label :value, search[:title], class: 'col-form-label col-4' %>
           <div class="col-7">
             <%= translation_fields.text_field_without_bootstrap :value, class: 'form-control' %>
@@ -37,10 +37,10 @@
       <% end %>
 
       <% subtitle_translation = Translation.find_or_initialize_by(exhibit: current_exhibit, key: "#{search.slug}.subtitle", locale: @language) %>
-      <div data-translation-progress-item="true" class="row form-group browse-category-subtitle">
+      <div data-translation-progress-item="true" class="row form-group mb-3 browse-category-subtitle">
         <div class="col-7 offset-4">
           <%= f.fields_for :translations, subtitle_translation do |translation_fields| %>
-            <%= button_tag 'type' => 'button', class: 'btn btn-text collapse-toggle collapsed translation-subtitle-toggle', 'data-toggle': 'collapse', 'data-target': "#browse_category_subtitle_#{search.id}", 'aria-expanded': 'false', 'aria-controls': "#browse_category_subtitle_#{search.id}" do %>
+            <%= button_tag 'type' => 'button', class: 'btn btn-text collapse-toggle collapsed translation-subtitle-toggle', 'data-toggle': 'collapse','data-bs-toggle': 'collapse', 'data-target': "#browse_category_subtitle_#{search.id}", 'data-bs-target': "#browse_category_subtitle_#{search.id}", 'aria-expanded': 'false', 'aria-controls': "#browse_category_subtitle_#{search.id}" do %>
               <%= translation_fields.label :value, t(:'.subtitle_label') %>
             <% end %>
             <span class="collapse-chevron">❯</span>
@@ -49,7 +49,7 @@
             <%= translation_fields.hidden_field :locale %>
             <div id="browse_category_subtitle_<%= search.id %>" class="card card-body collapse panel-translation">
               <%= translation_fields.text_field_without_bootstrap :value, class: 'form-control' %>
-              <small class="form-text text-muted"><%= search[:subtitle] %></small>
+              <div class="form-text text-muted mb-3"><%= search[:subtitle] %></div>
             </div>
           <% end %>
         </div>
@@ -63,10 +63,10 @@
       </div>
 
       <% description_translation = Translation.find_or_initialize_by(exhibit: current_exhibit, key: "#{search.slug}.long_description", locale: @language) %>
-      <div data-translation-progress-item="true" class="row form-group browse-category-description">
+      <div data-translation-progress-item="true" class="row form-group mb-3 browse-category-description">
         <div class="col-7 offset-4">
           <%= f.fields_for :translations, description_translation do |translation_fields| %>
-            <%= button_tag 'type' => 'button', class: 'btn btn-text collapse-toggle collapsed translation-description-toggle', 'data-toggle': 'collapse', 'data-target': "#browse_category_description_#{search.id}", 'aria-expanded': 'false', 'aria-controls': "#browse_category_description_#{search.id}" do %>
+            <%= button_tag 'type' => 'button', class: 'btn btn-text collapse-toggle collapsed translation-description-toggle', 'data-toggle': 'collapse', 'data-bs-toggle': 'collapse', 'data-target': "#browse_category_description_#{search.id}", 'data-bs-target': "#browse_category_description_#{search.id}", 'aria-expanded': 'false', 'aria-controls': "#browse_category_description_#{search.id}" do %>
               <%= translation_fields.label :value, t(:'.description_label') %>
             <% end %>
             <span class="collapse-chevron">❯</span>
@@ -75,7 +75,7 @@
             <%= translation_fields.hidden_field :locale %>
             <div id="browse_category_description_<%= search.id %>" class="card card-body collapse panel-translation">
               <%= translation_fields.text_area_without_bootstrap :value, class: 'form-control' %>
-              <small class="form-text text-muted"><%= search[:long_description] %></small>
+              <div class="form-text text-muted mb-3"><%= search[:long_description] %></div>
             </div>
           <% end %>
         </div>