Merge pull request #403 from MITLibraries/use-471

USE-471: Adding About to USE navigation

Author: djanelle-mit

app/assets/stylesheets/partials/_header.scss

@@ -92,11 +92,7 @@
             font-size: 1.8rem;
             font-weight: $fw-medium;
             @include text-decoration-animation;
-
-            &:hover {
-                text-decoration: underline;
-                color: $color-white;
-            }            
+            @include headerUnderlinedLinks;       
         }
     }
 }

app/assets/stylesheets/partials/_search.scss

@@ -2,19 +2,6 @@
 // #SEARCH BITS
 // ------------------------
 
-/* Shared link styling */
-@mixin searchUnderlinedLinks {
-  color: $color-text-oncolor;
-  font-weight: $fw-medium;
-  text-decoration: underline;
-  text-decoration-color: $color-red-500;
-  text-underline-offset: 0.5rem;  
-
-  &:hover {
-    color: $color-red-400;
-  }
-}
-
 /* New USE UI search styles */
 #search-form {
   margin: 0;
@@ -299,7 +286,7 @@
   gap: 24px;
 
   a {
-    @include searchUnderlinedLinks();
+    @include headerUnderlinedLinks();
   }
 
   .semantic-search-toggle {
@@ -310,7 +297,7 @@
       background-color: transparent;
       border: none;
       cursor: pointer;
-      @include searchUnderlinedLinks();
+      @include headerUnderlinedLinks();
 
       &::before {
         background-color: $color-gray-800;

app/assets/stylesheets/partials/_source_tabs.scss

@@ -37,7 +37,7 @@
     border-bottom: 0;  
     white-space: nowrap;
 
-    @include searchUnderlinedLinks;
+    @include headerUnderlinedLinks;
 
     &:hover {
       border-color: $color-gray-700;
@@ -87,7 +87,7 @@
         width: 100%;
 
         &.active {
-          @include searchUnderlinedLinks;
+          @include headerUnderlinedLinks;
         }
 
         &:hover {

app/assets/stylesheets/partials/_typography.scss

@@ -22,6 +22,19 @@
   }
 }
 
+/* Shared link styling */
+@mixin headerUnderlinedLinks {
+  color: $color-text-oncolor;
+  font-weight: $fw-medium;
+  text-decoration: underline;
+  text-decoration-color: $color-red-500;
+  text-underline-offset: 0.5rem;  
+
+  &:hover {
+    color: $color-red-400;
+  }
+}
+
 // Override fonts from the theme gem, done temporarily for USE UI
 body {
   font-family: $base-font;

app/views/layouts/_site_header.html.erb

@@ -18,12 +18,14 @@
           <a href="/" class="platform-name"><%= ENV.fetch('PLATFORM_NAME') %></a>
         <% end %>
       </h1>
-      <% if Feature.enabled?(:geodata) %>
-        <nav class="main-navigation" aria-label="Main navigation">
-          <%= nav_link_to("GIS at MIT", "https://libraries.mit.edu/gis") %>
-          <%= nav_link_to("Ask GIS", "https://libraries.mit.edu/ask-gis") %>
-        </nav>
-      <% end %>
+      <nav class="main-navigation" aria-label="Main navigation">
+        <% if Feature.enabled?(:geodata) %>
+            <%= nav_link_to("GIS at MIT", "https://libraries.mit.edu/gis") %>
+            <%= nav_link_to("Ask GIS", "https://libraries.mit.edu/ask-gis") %>
+        <% else %>
+            <%= nav_link_to("About", "https://libraries.mit.edu/new-search/") %>
+        <% end %>
+      </nav>
     </header>
     <%= render partial: 'search/form' unless Feature.enabled?(:geodata) %>
   </div>