Notification Ui changes --Partial Changes

angular.json

@@ -1,5 +1,8 @@
 {
   "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "cli": {
+    "analytics": false
+  },
   "version": 1,
   "newProjectRoot": "projects",
   "projects": {

src/app/notifications/notifications.component.html

@@ -1,6 +1,6 @@
 <section class="notifications">
     <header>
-        <h4> Notification </h4>
+        <h4> Notifications </h4>
     </header>
 
     <ul>

src/app/notifications/notifications.component.scss

@@ -0,0 +1,42 @@
+header {
+    background-color: white;
+    position: sticky;
+    top: 0;
+    padding: 1.5rem 2rem;
+    border-bottom: 1px solid var(--border-grey);
+
+    h4{
+        font-size: 1.8rem;
+        color: var(--primary);
+        font-weight: 500;
+    }
+}
+
+ul {
+    list-style: none;
+
+    li {
+        display: block;
+        padding: 1.5rem 2rem;
+        
+
+        h5 {
+            font-size: 1.4rem;
+            margin: 0 0 0.5rem;
+            font-weight: 500;
+        }
+
+        p {
+            color: var(--dark-grey);
+            font-size: 1.3rem;
+        }
+
+        .time-stamp {
+            display: block;
+            margin: 1rem 0 0;
+            font-size: 3rem;
+            font-size: 1.3rem;
+            color: var(--dark-grey);
+        }
+    }
+}

src/app/tabs/tabs.component.scss

@@ -184,6 +184,7 @@ $header-height: 10rem;
     z-index: 2;
     right: 26rem;
     border-radius: 1.5rem;
+    overflow: auto;
 }
 
 .page {