Merge pull request #2665 from sul-dlss/2657-search-tips-markup

Fix search tips modal markup

app/components/search_tips_component.html.erb

@@ -1,10 +1,10 @@
 <%= render Blacklight::System::ModalComponent.new do |component| %>
   <% component.with_title do %>
-    <div><h2 class="modal-title"> <%= t('search_tips.title') %> </h2></div>
-    <div><h3> <%= t('search_tips.subtitle') %> </h3></div>
+    <%= t('search_tips.title') %>
   <% end %>
   <% component.with_body do %>
-    <ul class="mt-3 pe-4 pb-2">
+    <h2 class="pt-3 ps-3"><%= t('search_tips.subtitle') %></h2>
+    <ul class="pe-4">
       <li> Use quotation marks to search as a <span class="fw-bold">phrase</span>. (Word-stemming will still be applied to words within the phrase.) </li>
       <li> Use "+" (no space) before a word to make it <span class="fw-bold">required</span>. </li>
       <li> Use "-" (no space) before a word or phrase to <span class="fw-bold">exclude</span>. </li>

spec/components/search_tips_component_spec.rb

@@ -6,12 +6,12 @@
   subject(:rendered) { Capybara::Node::Simple.new(render_inline(described_class.new)) }
 
   it 'displays a title with a subheading' do
-    expect(rendered).to have_selector('h2.modal-title', text: 'Search tips')
-    expect(rendered).to have_selector('h3', text: 'Refine your search')
+    expect(rendered).to have_selector('h1.modal-title', text: 'Search tips')
+    expect(rendered).to have_selector('h2', text: 'Refine your search')
   end
 
   it 'includes search tips text' do
-    expect(rendered).to have_selector('ul.mt-3 li', count: 7)
+    expect(rendered).to have_selector('ul.pe-4 li', count: 7)
     expect(rendered).to have_content('Use quotation marks to search')
   end