Add border and arrow for dropdown fields.

Contributed by @gjacob24 of DCC DMPonline.

The changes:
 - Replaced Selection_tag classes incorrectly set with  'form-control'
   to 'form-select'.

Co-authored-by: gjacob24 <[email protected]>

Author: John Pinto

app/views/devise/registrations/_personal_details.html.erb

@@ -45,7 +45,7 @@
           options_from_collection_for_select(departments, "id", "name", dept_id),
           include_blank: true,
           disabled: departments.count === 0,
-          class: "form-control") %>
+          class: "form-select") %>
     </div>
     <% end %>
 
@@ -55,7 +55,7 @@
       <%= f.label(:language_id, _('Language'), class: 'form-label') %>
       <%= select_tag("user[language_id]",
           options_from_collection_for_select(@languages, "id", "name", lang_id),
-          class: "form-control") %>
+          class: "form-select") %>
     </div>
   <% end %>
 

app/views/layouts/modal_search/README.md

@@ -138,7 +138,7 @@ Example definition of the :filters content:
     <%= select_tag :"research_output[subject_filter]",
                    options_for_select(ResearchOutputPresenter.selectable_subjects),
                    include_blank: _("- Select a subject area -"),
-                   class: "form-control",
+                   class: "form-select",
                    title: by_subject_tooltip,
                    data: { toggle: "tooltip", placement: "bottom" } %>
   </span>
@@ -147,7 +147,7 @@ Example definition of the :filters content:
     <%= select_tag :"research_output[type_filter]",
                    options_for_select(ResearchOutputPresenter.selectable_repository_types),
                    include_blank: _("- Select a repository type -"),
-                   class: "form-control",
+                   class: "form-select",
                    title: by_type_tooltip,
                    data: { toggle: "tooltip", placement: "bottom" } %>
   </span>

app/views/org_admin/users/edit.html.erb

@@ -32,7 +32,7 @@
         <%= select_tag(:department_id,
             options_from_collection_for_select(@departments, "id", "name", dept_id),
             include_blank: true,
-            class: "form-control",
+            class: "form-select",
             name: 'user[department_id]') %>
       </div>
       <% end %>
@@ -44,7 +44,7 @@
           <%= select_tag(:org_admin_user_language_id,
               options_from_collection_for_select(Language.sorted_by_abbreviation, "id", "name", lang_id),
               disabled: true,
-              class: "form-control", name: 'org_admin_user[language_id]') %>
+              class: "form-select", name: 'org_admin_user[language_id]') %>
         </div>
       <% end %>
 

app/views/plans/_download_form.html.erb

@@ -7,7 +7,7 @@
   <div class="row">
     <div class="form-control mb-3 col-sm-2">
       <%= select_tag :format, options_for_select(Settings::Template::VALID_FORMATS, :pdf),
-                     class: 'form-control', "aria-labelledby": "format" %>
+                     class: 'form-select', "aria-labelledby": "format" %>
     </div>
   </div>
 
@@ -17,7 +17,7 @@
     <% if @phase_options.length > 1 %>
       <div class="form-control mb-5">
         <%= label_tag(:phase_id, _("Select phase to download"), class: 'form-label') %>
-        <%= select_tag(:phase_id, options_for_select(@phase_options, @phase_options[0])) %>
+        <%= select_tag(:phase_id, options_for_select(@phase_options, @phase_options[0]), class: 'form-select') %>
       </div>
     <% else %>
       <%= hidden_field_tag(:phase_id, @phase_options[0][1]) %>
@@ -77,14 +77,14 @@
         <%= select_tag "export[formatting][font_face]",
             options_for_select(Settings::Template::VALID_FONT_FACES,
                                @export_settings.formatting[:font_face]),
-            class: 'form-control',
+            class: 'form-select',
             "data-default": @plan.template.settings(:export).formatting[:font_face] %>
       </div>
       <div class="form-control mb-3 px-2 col-sm-2">
         <%= label_tag "export[formatting][font_size]", _('Size') + " (pt)", class: 'form-label' %>
         <%= select_tag "export[formatting][font_size]",
             options_for_select(Settings::Template::VALID_FONT_SIZE_RANGE.to_a, @export_settings.formatting[:font_size]),
-            class: 'form-control',
+            class: 'form-select',
             "data-default": @plan.template.settings(:export).formatting[:font_size] %>
       </div>
 
@@ -94,7 +94,7 @@
         <%= select_tag "export[formatting][margin][top]",
             options_for_select(Settings::Template::VALID_MARGIN_RANGE.to_a,
                                @export_settings.formatting[:margin][:top]),
-            class: 'form-control',
+            class: 'form-select',
             "data-default": @plan.template.settings(:export).formatting[:margin][:top] %>
       </div>
       <div class="form-control mb-3 px-2 col-sm-1">
@@ -103,7 +103,7 @@
         <%= select_tag "export[formatting][margin][bottom]",
             options_for_select(Settings::Template::VALID_MARGIN_RANGE.to_a,
                                @export_settings.formatting[:margin][:bottom]),
-            class: 'form-control',
+            class: 'form-select',
             "data-default": @plan.template.settings(:export).formatting[:margin][:bottom] %>
       </div>
       <div class="form-control mb-3 px-2 col-sm-1">
@@ -112,7 +112,7 @@
         <%= select_tag "export[formatting][margin][left]",
             options_for_select(Settings::Template::VALID_MARGIN_RANGE.to_a,
                                @export_settings.formatting[:margin][:left]),
-            class: 'form-control',
+            class: 'form-select',
             "data-default": @plan.template.settings(:export).formatting[:margin][:left] %>
       </div>
       <div class="form-control mb-3 px-2 col-sm-1">
@@ -121,7 +121,7 @@
         <%= select_tag "export[formatting][margin][right]",
             options_for_select(Settings::Template::VALID_MARGIN_RANGE.to_a,
                                @export_settings.formatting[:margin][:right]),
-            class: 'form-control',
+            class: 'form-select',
             "data-default": @plan.template.settings(:export).formatting[:margin][:right] %>
       </div>
     </div>

app/views/plans/new.html.erb

@@ -107,7 +107,7 @@
         <div class="form-control mb-3 row">
           <div class="col-md-6">
             <%= select_tag(:plan_template_id, "<option value=\"\">#{_('Please select a template')}</option>", name: 'plan[template_id]',
-                           class: 'form-control', 'aria-labelledby': 'template-selection') %>
+                           class: 'form-select', 'aria-labelledby': 'template-selection') %>
           </div>
           <div class="col-md-6">
             <span id="multiple-templates">

app/views/questions/_new_edit_question_option_based.html.erb

@@ -34,7 +34,7 @@
         options_html.html_safe,
         { multiple: question.question_format.multiselectbox?,
           include_blank: question.question_format.dropdown?,
-          class: 'form-control' }) %>
+          class: 'form-select' }) %>
 <% end %>
 <div class="form-control mb-3">
 <% if question.option_comment_display %><!-- Comment text area for option_based questions -->

app/views/research_outputs/licenses/_form.html.erb

@@ -16,7 +16,7 @@ show_preferred = selected.nil? || (selected != 0 && preferred_licenses.map { |ar
 options = show_preferred ? preferred_licenses : presenter.complete_licenses
 guidance = show_preferred ? preferred_guidance : default_guidance
 
-args = { include_blank: _("- Please select one -"), selected: selected, class: "form-control",
+args = { include_blank: _("- Please select one -"), selected: selected, class: "form-select",
          aria: { label: _('Initial license') } }
 args[:data] = { remote: true, url: plan_license_selection_path(research_output.plan), method: :get } if show_preferred
 %>

app/views/research_outputs/repositories/_search.html.erb

@@ -10,7 +10,7 @@
     <%= select_tag :"research_output[subject_filter]",
                    options_for_select(ResearchOutputPresenter.selectable_subjects),
                    include_blank: _("- Select a subject area -"),
-                   class: "form-control",
+                   class: "form-select",
                    aria: { label: _('Select a subject area') },
                    title: by_subject_tooltip,
                    data: { toggle: "tooltip", placement: "bottom" } %>
@@ -20,7 +20,7 @@
     <%= select_tag :"research_output[type_filter]",
                    options_for_select(ResearchOutputPresenter.selectable_repository_types),
                    include_blank: _("- Select a repository type -"),
-                   class: "form-control",
+                   class: "form-select",
                    aria: { label: _('Select a repository type') },
                    title: by_type_tooltip,
                    data: { toggle: "tooltip", placement: "bottom" } %>

app/views/super_admin/users/_confirm_merge.html.erb

@@ -8,7 +8,7 @@
       <span class="input-group-text" id="search-addon">
         <span class="fas fa-magnifying-glass" aria-hidden="true"></span>
       </span>
-    <%= select_tag(:merge_id, options_from_collection_for_select(@users, "id", "email"), class: "form-control") %>
+    <%= select_tag(:merge_id, options_from_collection_for_select(@users, "id", "email"), class: "form-select") %>
     </div>
   </div>
   <%= submit_tag( _("Merge"), class: 'btn btn-secondary', style: 'margin-top: 8px;', data: { confirm: "placeholder" }) %>

app/views/super_admin/users/edit.html.erb

@@ -42,7 +42,7 @@
         <%= select_tag(:department_id,
             options_from_collection_for_select(@departments, "id", "name", dept_id),
             include_blank: true,
-            class: "form-control",
+            class: "form-select",
             name: 'user[department_id]') %>
       </div>
       <% end %>
@@ -53,7 +53,7 @@
           <%= f.label(:language_id, _('Language'), class: 'form-label') %>
           <%= select_tag(:super_admin_user_language_id,
               options_from_collection_for_select(Language.sorted_by_abbreviation, "id", "name", lang_id),
-              class: "form-control", name: 'user[language_id]') %>
+              class: "form-select", name: 'user[language_id]') %>
         </div>
       <% end %>