ROENROLL-1815 outage banner

src/app/app.component.html

+<div class="alert-banner">
+  <p><md-icon class="material-icons error" role="img" aria-hidden="true">warning</md-icon> Course Search & Enroll will not be available from June 28 at 4:00pm to July 8 at 8:00am due to the <a href="https://upgrade.sis.wisc.edu/" target="_blank">SIS Upgrade.</a></p>
+</div>
 <header ngClass.sm="hide-navigation-bar" ngClass.xs="hide-navigation-bar" role="banner">
   <cse-header></cse-header>
   <cse-navigation></cse-navigation>

src/app/app.component.scss

@@ -4,7 +4,7 @@
 
 header {
   position: absolute;
-  top: 0;
+  top: 44px;
   left: 0;
   width: 100%;
   height: 112px;
@@ -20,7 +20,7 @@ header {
 
 main {
   position: absolute;
-  top: 112px;
+  top: 156px;
   left: 0;
   bottom: 0;
   right: 0;
@@ -32,3 +32,25 @@ main {
   min-width: 360px;
   height: 100vh;
 }
+
+.alert-banner {
+  position: absolute;
+  top: 0;
+  width: 100%;
+  background-color: white;
+  p {
+    margin: 13px 0;
+    padding: 0px 15px;
+    font-family: mat-font-family($config);
+    font-size: 13px;
+    -webkit-font-smoothing: antialiased;
+  }
+  md-icon {
+    font-size: 16px;
+    color: #ff8000;
+    top: 2px;
+  }
+  a {
+    text-decoration: none;
+  }
+}