From cc1e51a61e126a1a2a9fa9a99aa7b69fd42455f6 Mon Sep 17 00:00:00 2001
From: Courage Angeh <courageangeh@gmail.com>
Date: Fri, 15 Nov 2019 03:33:21 -0500
Subject: [PATCH] Add CSS to highlight new notification (#3083)

---
 app/styles-dev/main/components/_notifications.scss | 11 +++++++++--
 app/views/_topnavbar.html                          |  2 +-
 app/views/notification/notifications.html          |  2 +-
 3 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/app/styles-dev/main/components/_notifications.scss b/app/styles-dev/main/components/_notifications.scss
index 8dc92f2d..6a2e1d15 100644
--- a/app/styles-dev/main/components/_notifications.scss
+++ b/app/styles-dev/main/components/_notifications.scss
@@ -28,7 +28,7 @@
   overflow-y:auto;
   overflow-x:hidden;
   background:#fff;
-  
+
   position:absolute;
   z-index:100;
   right:0;
@@ -70,7 +70,14 @@
     text-align: center;
     padding: 8px 5px;
   }
-  
+
 }
 
+.new-notification {
+  font-weight: bold;
+  border-left: #4f99ed solid 2px;
 
+  h4 {
+    font-weight: bold;
+  }
+}
diff --git a/app/views/_topnavbar.html b/app/views/_topnavbar.html
index b995379e..889ed9be 100644
--- a/app/views/_topnavbar.html
+++ b/app/views/_topnavbar.html
@@ -87,7 +87,7 @@
                     <div class="numberCircle" ng-hide="numberOfUnreadNotifications == 0">{{ numberOfUnreadNotifications }}</div>
                     <ul class="notification-container" uib-dropdown-menu>
                         <ul class="notification-list" ng-repeat="notification in notifications">
-                            <li ng-click="navigateToAction(notification)">
+                            <li ng-class="notification.isRead ? '' : 'new-notification'" ng-click="navigateToAction(notification)">
                                 <h4>{{ notification.content }}</h4>
                                 <span>{{ notification.createdAt }}</span>
                             </li>
diff --git a/app/views/notification/notifications.html b/app/views/notification/notifications.html
index 37ae517e..3306686d 100644
--- a/app/views/notification/notifications.html
+++ b/app/views/notification/notifications.html
@@ -9,7 +9,7 @@
                 </tr>
                 </thead>
                 <tbody>
-                <tr class="pointer-main" dir-paginate="notification in notifications | itemsPerPage: notificationsPerPage"
+                <tr ng-class="notification.isRead ? '' : 'new-notification'" class="pointer-main" dir-paginate="notification in notifications | itemsPerPage: notificationsPerPage"
                     total-items="totalNotifications" ng-click="navigateToAction(notification)">
                     <td class="pointer">{{ notification.content }}</td>
                     <td>{{ notification.createdAt }}</td>