Use existing notification styling

services/web/app/views/project/list/notifications.pug

@@ -22,25 +22,6 @@ if hasFeature('v2-banner')
 										span(aria-hidden="true") ×
 										span.sr-only #{translate("close")}
 
-.userNotifications
-	ul.list-unstyled.notifications-list(
-		ng-controller="UserAffiliationsController",
-		ng-cloak
-	)
-		li.notification_entry(
-			ng-repeat="userEmail in userEmails",
-      ng-if="!userEmail.confirmedAt"
-		)
-			.row
-				.col-xs-12
-					.alert.alert-email
-						.notification_inner
-							| Please confirm your email {{userEmail.email}} by clicking on the link in the confirmation email 
-							a(
-								href,
-								ng-click="resendConfirmationEmail(userEmail)"
-							) (#{translate('resend_confirmation_email')})
-
 span(ng-controller="NotificationsController").userNotifications
 	ul.list-unstyled.notifications-list(
 		ng-if="notifications.length > 0",
@@ -101,3 +82,21 @@ span(ng-controller="NotificationsController").userNotifications
 									button(ng-click="dismiss(notification)").close.pull-right
 										span(aria-hidden="true") ×
 										span.sr-only #{translate("close")}
+
+	ul.list-unstyled.notifications-list(
+		ng-controller="EmailNotificationController",
+		ng-cloak
+	)
+		li.notification_entry(
+			ng-repeat="userEmail in userEmails",
+			ng-if="!userEmail.confirmedAt"
+		)
+			.row
+				.col-xs-12
+					.alert.alert-warning
+						.notification_inner
+							| Please confirm your email {{userEmail.email}} by clicking on the link in the confirmation email 
+							a(
+								href,
+								ng-click="resendConfirmationEmail(userEmail)"
+							) (#{translate('resend_confirmation_email')})

services/web/public/coffee/main/project-list/notifications-controller.coffee

@@ -53,3 +53,16 @@ define [
 				localStorage('overleaf_v1_notification_hidden_at', Date.now())
 			else
 				localStorage('overleaf_v1_notification_hidden_at', null)
+
+	App.controller "EmailNotificationController", ($scope, $http, UserAffiliationsDataService) ->
+		$scope.userEmails = []
+
+		_getUserEmails = () ->
+				UserAffiliationsDataService
+					.getUserEmails().then (emails) -> 
+						$scope.userEmails = emails
+		_getUserEmails()
+
+		$scope.resendConfirmationEmail = (userEmail) ->
+			UserAffiliationsDataService
+				.resendConfirmationEmail userEmail.email

services/web/public/stylesheets/components/alerts.less

@@ -74,12 +74,4 @@
   .btn {
     text-decoration: none;
   }
-}
-
-.alert-email {
-  .alert-variant(@alert-email-bg; @alert-email-border; @alert-email-text);
-
-  a {
-    color: @link-color;
-  }
 }

services/web/public/stylesheets/core/_common-variables.less

@@ -586,9 +586,6 @@
 @alert-danger-text:           @state-danger-text;
 @alert-danger-border:         @state-danger-border;
 
-@alert-email-bg      : white;
-@alert-email-text    : #FFF;
-@alert-email-border  : @red;
 
 //== Progress bars
 //

services/web/public/stylesheets/core/ol-variables.less

@@ -108,9 +108,6 @@
 @alert-danger-text   : #FFF;
 @alert-danger-border : transparent;
 
-@alert-email-bg      : #FFF;
-@alert-email-text    : @ol-type-color;
-@alert-email-border  : @ol-green;
 
 // Tags
 @tag-border-radius       : 9999px;