From 3fcb96229ef0a11e955ca3535a0b67b479599345 Mon Sep 17 00:00:00 2001
From: Drew Ansbacher <drew.ansbacher@gmail.com>
Date: Tue, 10 Aug 2021 13:26:15 -0600
Subject: [PATCH] mail icon (#402)

Co-authored-by: Drew Ansbacher <drew.ansbacher@spiredigital.com>
---
 ui/src/app/app.component.html                    |  1 +
 .../pages/notifications/notifications.page.html  | 16 +++++++++++-----
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html
index aa4aa7fdd..722a5feb9 100644
--- a/ui/src/app/app.component.html
+++ b/ui/src/app/app.component.html
@@ -89,6 +89,7 @@
     <ion-icon name="information-circle-outline"></ion-icon>
     <ion-icon name="list-outline"></ion-icon>
     <ion-icon name="logo-bitcoin"></ion-icon>
+    <ion-icon name="mail-outline"></ion-icon>
     <ion-icon name="medkit-outline"></ion-icon>
     <ion-icon name="newspaper-outline"></ion-icon>
     <ion-icon name="notifications-outline"></ion-icon>
diff --git a/ui/src/app/pages/notifications/notifications.page.html b/ui/src/app/pages/notifications/notifications.page.html
index 207f24740..49d58dfd5 100644
--- a/ui/src/app/pages/notifications/notifications.page.html
+++ b/ui/src/app/pages/notifications/notifications.page.html
@@ -20,11 +20,17 @@
   <!-- no notifications -->
   <ng-container *ngIf="!loading">
     <ion-item-group *ngIf="!notifications.length">
-      <ion-item>
-        <ion-label class="ion-text-wrap">
-          Notifications about Embassy and services will appear here.
-        </ion-label>
-      </ion-item>
+      <div 
+        style="
+          text-align: center;
+          position: absolute;
+          top: 40%;
+          left: 50%;
+          transform: translate(-50%, -50%);"
+      >
+        <ion-icon style="font-size: 84px; color: #282c33" name="mail-outline"></ion-icon>
+        <h4 style="color: #282c33; margin-top: 0px">Inbox Empty</h4>
+      </div>
     </ion-item-group>
   
     <!-- has notifications  -->