Add classes to the markup

This allows the user to customize the markup without having to override css
projectblacklight · Dec 18, 2024 · 1e2702d · 1e2702d
1 parent 4e65bca
commit 1e2702d
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 16 deletions.
diff --git a/app/assets/stylesheets/spotlight/_header.scss b/app/assets/stylesheets/spotlight/_header.scss
@@ -18,7 +18,6 @@
   padding: 0;
   position: relative;
 
-
   .site-title {
     margin-bottom: 0;
   }
@@ -30,14 +29,6 @@
     white-space: nowrap;
   }
 
-  small {
-    @extend .d-none;
-    @extend .d-md-block;
-    @extend .py-2;
-
-    font-size: $h4-font-size;
-  }
-
   .navbar {
     &:last-child {
       margin-bottom: 0;
@@ -128,12 +119,11 @@
   // especially on light background images.
   .background-container-gradient {
     @include masthead-background-containers();
-    background:
-     linear-gradient(
-       rgba(0, 0, 0, 0.0),
-       rgba(0, 0, 0, 0.4),
-       rgba(0, 0, 0, 0.5)
-     );
+    background: linear-gradient(
+      rgba(0, 0, 0, 0),
+      rgba(0, 0, 0, 0.4),
+      rgba(0, 0, 0, 0.5)
+    );
 
     height: 100%;
   }

diff --git a/app/views/shared/_masthead.html.erb b/app/views/shared/_masthead.html.erb
@@ -33,7 +33,7 @@
           <%= masthead_heading_content %>
         </h1>
         <% if masthead_subheading_content %>
-          <small><%= masthead_subheading_content %></small>
+          <small class="d-none d-md-block py-2 fs-4"><%= masthead_subheading_content %></small>
         <% end %>
       <% end %>
     </div>