Merge pull request #528 from byuweb/feat/update-byu-footer-logo

feat: Update footer with official BYU logos to match Brightspot

components/byu-footer/byu-footer.js

@@ -54,7 +54,11 @@ export class BYUFooter extends LitElement {
             </div>
         </div>
         <div class="university-footer-lt-1440">
-            <div class="university-logo"><a href="https://www.byu.edu/">Brigham Young University</a></div>
+            <div class="university-logo">
+              <a href="https://byu.edu" target="_blank">
+                <img class="university-logo-image" src="https://cdn.byu.edu/shared-icons/latest/logos/monogram-white.svg" alt="BYU">
+              </a>
+            </div>
             <div class="university-info">
                 <span class="info-text">Provo, UT 84602, USA</span>
                 <span class="info-text"><a class="contact-phone" href="tel:18014224636">801-422-4636</a></span>

components/byu-footer/byu-footer.sass

@@ -57,6 +57,10 @@ $tabletBreak: 1024px // Put exact px to match Brightspot and so info doesn't wor
     a:hover
       text-decoration: none
 
+  .university-logo-image
+    height: 23px
+    font-size: 10px
+
   .university-info
     display: flex
     margin-top: $spacing2
@@ -68,7 +72,7 @@ $tabletBreak: 1024px // Put exact px to match Brightspot and so info doesn't wor
     display: none
 
   .university-footer-lt-1440
-    display: flex
+    display: grid
     align-items: center
     flex-direction: column
     width: 100%
@@ -84,7 +88,7 @@ $tabletBreak: 1024px // Put exact px to match Brightspot and so info doesn't wor
   @media (min-width: $tabletBreak)
     .university-footer-lt-1440
       display: grid
-      grid-template-columns: 1fr 2fr
+      grid-template-columns: 0fr 2fr
       grid-template-rows: auto
       padding: 30px 80px
       font-size: 14px