Merge pull request #398 from MITLibraries/spacing-fixes

Style updates to the NLS opt-in page and alert in tabs where it doesn't apply

Author: djanelle-mit

app/assets/stylesheets/partials/_results.scss

@@ -24,7 +24,7 @@
   .no-results + .ask-us {
     margin-top: 0rem;
   }
-  
+
   .results-context {
     margin-top: -15px;
     padding-left: 2.5rem;
@@ -409,10 +409,14 @@
   padding-top: 12px;
   padding-bottom: 44px;
 
+  .results-header {
+    margin-bottom: 40px;
+  }
+
   .results-context {
     padding-left: 0;
     margin-top: 0;
-    margin-bottom: 24px;
+    margin-bottom: 8px;
   }
 
   #results-section {
@@ -599,7 +603,6 @@ aside.nls-alert {
 
 // RESULTS LIST NLS ALERT
 aside.nls-alert {
-  margin-bottom: 40px;
   display: flex;
   gap: 6px;
 

app/assets/stylesheets/partials/_search.scss

@@ -259,6 +259,30 @@
   }
 }
 
+/* ABOUT NLS PAGE */
+.about-nls {
+  padding-top: 32px;
+  padding-bottom: 32px;
+  max-width: 760px;
+
+  h2 {
+    margin-bottom: 32px;
+  }
+  
+  h3 {
+    margin-top: 32px;
+    margin-bottom: 16px;
+  }
+
+  p {line-height: $lh-xloose;}
+
+  a {
+    @include underlinedLinks;
+    font-weight: $fw-medium;
+  }
+}
+
+
 .tab-link {
   color: #fff;
 }

app/views/search/results.html.erb

@@ -16,11 +16,12 @@
         <%= render partial: 'search/primo_continuation' %>
 
       <% elsif @results.present? && @errors.blank? %>
-
-        <h2 class="results-context" data-matomo-seen="Search, Results Found, Tab: {{getActiveTabName}}"><%= results_summary(@pagination[:hits]) %></h2>
-        <% if @show_nls_warning %>
-          <%= render partial: 'search/nls_alert' %>
-        <% end %>
+        <div class="results-header">
+          <h2 class="results-context" data-matomo-seen="Search, Results Found, Tab: {{getActiveTabName}}"><%= results_summary(@pagination[:hits]) %></h2>
+          <% if @show_nls_warning %>
+            <%= render partial: 'search/nls_alert' %>
+          <% end %>
+        </div>
         <div id="results-layout-wrapper">
           <main id="results">
             <ol class="results-list use" data-matomo-click="Results, Link Engaged, Link: {{getElementText}}; Tab: {{getActiveTabName}}" start="<%= @pagination[:start] %>">

app/views/static/about_natural_language_search.html.erb

@@ -1,12 +1,12 @@
 <% content_for :title, "About Natural Language Search" %>
 
-<div class="container">
+<div class="container about-nls">
   <h2>Opting in to Natural Language Search</h2>
 
   <h3>What does turning on the Natural Language Search (NLS) do?</h3>
 
   <p>By default, this search tool uses traditional keyword matching.</p>
- 
+
   <p>If you enable the Natural Language Search (NLS) option, the search tries to understand the meaning and intent behind your search terms, not just matching exact keywords.</p>
 
   <p>For example, if you search for "climate change impacts," the NLS can find results about "global warming effects" or "environmental shifts"&mdash;even if those exact words don't appear together or at all in the source.</p>