Refactor templates to keep Spotlight's header navbar

This ensures that the header and navbar are still displayed on
pages where the masthead is not (like auth flow pages), and
removes some places where we overrode Spotlight.

See #1372

app/assets/stylesheets/dlme.scss

@@ -169,7 +169,11 @@ body {
 }
 
 .masthead .site-title {
-  white-space: normal;
+  visibility: hidden;
+
+  + small {
+    visibility: hidden;
+  }
 }
 
 .exhibit-navbar {
@@ -253,21 +257,24 @@ body {
 }
 
 .topbar {
+  position: absolute;
+  width: 100vw;
+  z-index: 1;
   background-color: $topnav-background-color !important;
-  margin-bottom: 4rem;
   padding-bottom: .25rem;
   padding-top: .5rem;
 
-  @include media-breakpoint-down('sm') {
-    margin-bottom: 0;
+  // extra spacing when there's no masthead in between navbar and content
+  + #main-container {
+    padding-top: 8rem !important;
   }
 }
 
-.masthead .topbar  .navbar-nav {
+.topbar  .navbar-nav {
   text-transform: none;
 }
 
-.masthead .topbar .navbar-nav .nav-link {
+.topbar .navbar-nav .nav-link {
   color: $color-gray-lightest;
 
   &:active,
@@ -378,3 +385,12 @@ body {
 .breadcrumb-item > span > :not(:first-child) {
   display: none;
 }
+
+// Turn off transparency for the topbar on pages where there's no masthead
+body.blacklight-sessions,
+body.blacklight-registrations,
+body.blacklight-passwords {
+  .topbar {
+    background-color: $color-primary !important;
+  }
+}

app/views/shared/_header_navbar.html.erb

@@ -1 +1,17 @@
-<%# blank out default layout behavior %>
+<span class="background-container-gradient"></span>
+<nav class="navbar navbar-expand-md navbar-dark topbar" role="navigation" aria-label="<%= t('spotlight.topbar.label') %>">
+  <div class="<%= container_classes %>">
+    <%= link_to main_app.root_url, class: 'navbar-brand' do %>
+      <%= image_tag 'logo.png', class: 'dlme-logo', alt: '', role: 'presentation' %>
+      <%= t('application_name') %>
+    <% end %>
+
+    <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#user-util-collapse" aria-controls="user-util-collapse" aria-expanded="false" aria-label="<%= t :toggle_nav %>">
+      <span class="navbar-toggler-icon"></span>
+    </button>
+
+    <div class="collapse navbar-collapse justify-content-md-end" id="user-util-collapse">
+      <%= render partial: 'shared/user_util_links' %>
+    </div>
+  </div>
+</nav>