Overrode styles from mitlib-style for footer and institute footer

Author: djanelle-mit

app/assets/stylesheets/partials/_layouts.scss

@@ -1,3 +1,4 @@
+// GLOBAL LAYOUT STYLING
 .wrap-gridband, .wrap-notice, .wrap-header, 
 .wrap-header-local, .wrap-breadcrumb, .wrap-content, 
 .wrap-footer, .wrap-footer-institute, .wrap-footer.footer-slim, .wrapper {
@@ -22,14 +23,84 @@
 
 }
 
-.wrap-header .header-slim .logo-mit-lib img {height: 40px;} // Adjust Libraries logo to 40px height
-
 .wrapper {
   margin: 0 auto;
 }
 
+// HEADER STYLING
+.wrap-header .header-slim .logo-mit-lib img {height: 40px;} // Adjust Libraries logo to 40px height
+
 .hidden-md {
   @media (max-width: $bp-screen-md) {
     display: none;
   }
 }
+
+// FOOTER STYLES
+.wrap-footer.footer-slim {
+  padding-top: 32px;
+  padding-bottom: 32px;
+}
+
+.wrap-footer .identity {
+  margin-top: 0;
+  align-items: center;
+}
+
+.wrap-footer .wrap-logo-lib {
+  margin-right: 48px;
+}
+
+.wrap-footer.footer-slim .wrap-middle .wrap-policies {
+  padding-top: 0;
+  margin-left: 0;
+
+  nav {
+    display: flex;
+    gap: 32px;
+
+    a {
+      font-size: 1.5rem;
+      color: $color-gray-300;
+    }
+  }
+
+}
+
+// Adjust styles for navigation when on smaller screens
+@media (max-width: $bp-screen-md) {
+  .wrap-footer.footer-slim .identity {
+    margin-bottom: 0;
+  }
+
+  .wrap-footer.footer-slim .wrap-middle .wrap-policies {  
+    border-top: none;
+      
+    nav {
+      gap: 24px;
+    }
+  }
+}
+
+.wrap-footer-institute {
+  padding-top: 16px;
+  padding-bottom: 16px;
+
+  .footer-info-institute {
+    align-items: center;
+    color: $color-gray-300;
+  }
+
+  a.link-logo-mit img {
+    max-width: unset;
+  }
+
+  .license {
+    font-size: 1.3rem;
+
+    a {
+      color: $color-gray-300;
+    }
+  }
+
+}

app/views/layouts/_institute_footer.html.erb

@@ -6,7 +6,7 @@
         <img
           src="https://cdn.libraries.mit.edu/files/branding/local/mit_lockup_std-three-line_rgb_white.svg"
           alt="MIT logo"
-          width="150"
+          width="105"
         />
       </a>
 

app/views/layouts/_libraries_footer.html.erb

@@ -8,22 +8,18 @@
               <img
                 src="https://cdn.libraries.mit.edu/files/branding/local/mitlib-wordmark.svg"
                 alt="MIT Libraries logo"
-                width="150"
+                width="80"
               />
             </a>
         </div>
 
         <div class="wrap-middle">
           <div class="wrap-policies">
             <nav aria-label="MIT Libraries policy menu">
-              <span class="item"><a href="https://libraries.mit.edu/privacy" class="link-sub">Privacy</a></span>
-              
-              <span class="item"><a href="https://libraries.mit.edu/permissions" class="link-sub">Permissions</a></span>
-              
-              <span class="item"><a href="https://libraries.mit.edu/accessibility" class="link-sub">Accessibility</a></span>
-                            
-              <span class="item"><a href="https://libraries.mit.edu/contact" class="link-sub">Contact us</a></span>
-
+              <a href="https://libraries.mit.edu/privacy" class="link-sub">Privacy</a>
+              <a href="https://libraries.mit.edu/permissions" class="link-sub">Permissions</a>              
+              <a href="https://libraries.mit.edu/accessibility" class="link-sub">Accessibility</a>
+              <a href="https://libraries.mit.edu/contact" class="link-sub">Contact us</a>
             </nav>
           </div>
         </div>