aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/menu/notification.component.html
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/app/menu/notification.component.html')
-rw-r--r--client/src/app/menu/notification.component.html52
1 files changed, 52 insertions, 0 deletions
diff --git a/client/src/app/menu/notification.component.html b/client/src/app/menu/notification.component.html
new file mode 100644
index 000000000..beda1c43c
--- /dev/null
+++ b/client/src/app/menu/notification.component.html
@@ -0,0 +1,52 @@
1<div
2 [ngbPopover]="popContent" autoClose="outside" placement="bottom" container={this} popoverClass="popover-notifications"
3 i18n-title title="View your notifications" [ngClass]="{ 'notification-inbox-popover': true, 'shown': opened, 'hidden': isInMobileView }"
4 #popover="ngbPopover" (shown)="onPopoverShown()" (hidden)="onPopoverHidden()"
5>
6 <div *ngIf="unreadNotifications > 0" class="unread-notifications">{{ unreadNotifications }}</div>
7
8 <my-global-icon iconName="bell"></my-global-icon>
9</div>
10
11<div *ngIf="isInMobileView" i18n-title title="View your notifications" class="notification-inbox-link">
12 <div *ngIf="unreadNotifications > 0" class="unread-notifications">{{ unreadNotifications }}</div>
13
14 <a routerLink="/my-account/notifications" routerLinkActive="active" #link (click)="onNavigate(link)">
15 <my-global-icon iconName="bell"></my-global-icon>
16 </a>
17</div>
18
19<ng-template #popContent>
20 <div class="content" [ngClass]="{ loaded: loaded }">
21 <div class="notifications-header">
22 <div i18n>Notifications</div>
23
24 <div>
25 <button
26 *ngIf="unreadNotifications"
27 i18n-title title="Mark all as read" class="glyphicon glyphicon-ok mr-2"
28 (click)="markAllAsRead()"
29 ></button>
30 <a
31 i18n-title title="Update your notification preferences" class="glyphicon glyphicon-cog"
32 routerLink="/my-account/settings" fragment="notifications"
33 #settingsNotifications (click)="onNavigate(settingsNotifications)"
34 ></a>
35 </div>
36 </div>
37
38 <div *ngIf="!loaded" class="loader mt-4">
39 <my-loader [loading]="!loaded"></my-loader>
40 </div>
41
42 <my-user-notifications
43 [ignoreLoadingBar]="true" [infiniteScroll]="false" [itemsPerPage]="10"
44 [markAllAsReadSubject]="markAllAsReadSubject" (notificationsLoaded)="onNotificationLoaded()"
45 ></my-user-notifications>
46
47 <a *ngIf="loaded" class="all-notifications" routerLink="/my-account/notifications" #notifications (click)="onNavigate(notifications)">
48 <my-global-icon class="mr-1" iconName="bell" aria-hidden="true"></my-global-icon>
49 <span i18n>See all your notifications</span>
50 </a>
51 </div>
52</ng-template>