SHIBUI-928 Updating logo and footer

TIER · Oct 12, 2018 · 862ff78 · 862ff78
1 parent 9a2637a
commit 862ff78
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 21 deletions.
diff --git a/backend/src/main/resources/i18n/messages.properties b/backend/src/main/resources/i18n/messages.properties
@@ -80,6 +80,13 @@ brand.footer.links-label-4=Mailing List
 brand.footer.links-desc-4=Shibboleth.net open-source community mailing list
 brand.footer.copyright=Copyright \u00A9 Internet2
 
+brand.unicon=Unicon
+brand.unicon-logo=Unicon Logo
+brand.i2=Internet 2
+brand.i2-logo=Internet 2 Logo
+brand.in-partnership-with=In partnership with
+brand.and=and
+
 heading.shibboleth=Shibboleth
 
 label.metadata-source=Metadata Source

diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html
@@ -63,27 +63,36 @@
 </main>
 <footer>
     <div class="row">
-        <div class="col-md-8 copyright">
-            <ul class="list-inline">
-                <li class="list-inline-item" [translate]="brand.footer.text">{{ brand.footer.text }}</li>
-                <li class="list-inline-item" *ngFor="let link of brand.footer.links; let i = index;">
-                    <a [href]="link.url" target="_blank" [attr.aria-label]="link.description" [title]="link.description">
-                        <translate-i18n [key]="link.label">{{ link.label }}</translate-i18n>
-                    </a>
-                </li>
-            </ul>
-            <p>
-                <ng-container *ngIf="version$ | async">
-                {{ formatted$ | async }}
-                &nbsp;|&nbsp;
-                </ng-container>
-                <translate-i18n key="brand.footer.copyright" [params]="{ year: year }">Copyright &copy; Internet2</translate-i18n>
-            </p>
+        <div class="col-md-6 copyright">
+            <div class="d-flex flex-column align-items-start justify-content-between p-2">
+                <ul class="list-inline">
+                    <li class="list-inline-item" [translate]="brand.footer.text">{{ brand.footer.text }}</li>
+                    <li class="list-inline-item" *ngFor="let link of brand.footer.links; let i = index;">
+                        <a [href]="link.url" target="_blank" [attr.aria-label]="link.description" [title]="link.description">
+                            <translate-i18n [key]="link.label">{{ link.label }}</translate-i18n>
+                        </a>
+                    </li>
+                </ul>
+                <p>
+                    <ng-container *ngIf="version$ | async">
+                    {{ formatted$ | async }}
+                    &nbsp;|&nbsp;
+                    </ng-container>
+                    <translate-i18n key="brand.footer.copyright" [params]="{ year: year }">Copyright &copy; Internet2</translate-i18n>
+                </p>
+            </div>
         </div>
-        <div class="col-md-4 logo">
-            <a [href]="brand.logo.link.url" target="_blank" [title]="brand.logo.link.label">
-                <img [src]="brand.logo.default" class="img-fluid float-right" [alt]="brand.logo.alt">
-            </a>
+        <div class="col-md-6 logo">
+            <div class="d-flex align-items-end justify-content-end p-2">
+                <translate-i18n key="brand.in-partnership-with" class="flex-item mr-2">In partnership with</translate-i18n>&nbsp;
+                <a href="https://www.unicon.net" target="_blank" title="brand.unicon" class="flex-item">
+                    <img src="/assets/logo_unicon.png" class="img-fluid float-right" [alt]="'brand.unicon-logo' | translate">
+                </a>
+                &nbsp;<translate-i18n key="brand.and" class="flex-item mx-2">and</translate-i18n>&nbsp;
+                <a href="https://www.internet2.edu/" target="_blank" title="brand.i2" class="flex-item">
+                    <img src="/assets/logo_internet2.png" class="img-fluid float-right" [alt]="'brand.i2-logo' | translate">
+                </a>
+            </div>
         </div>
     </div>
 </footer>
diff --git a/ui/src/app/app.component.scss b/ui/src/app/app.component.scss
@@ -5,4 +5,11 @@ nav.navbar {
     .dropdown-menu {
         min-width: 12rem;
     }
-}
+}
+
+.logo a {
+    img {
+        display: inline-block;
+        max-height: 60px;
+    }
+}