[Library & Monitor Dashboard | new-theme]: Small update on notifications & filters offcanvas.
1. shadow.css: Added variable --shadow-main-dark. 2. offcanvas.css: a. Set --offcanvas-shadow: var(--shadow-main-dark); b. In class .offcanvas-switcher remove transition (will not be visible when offcanvas is open) c. [Bug fix] In class .offcanvas-count increased font size and make background always round, added line-height: 20px. d. In rule ".offcanvas .uk-offcanvas-bar" set border-radius to 4px. 3. notification-utils.ts: Full stop added in messages. 4. notification-sidebar.component.css: In rule "#notifications .notification-list ul" set height: calc(100% - 77px). 5. notifications-sidebar.component.ts: a. Removed anything related to offcavnas events b. Removed commented code c. Added in icons visuallyHidden. 6. monitor.component.html: a. Removed "open" class when offcanvas is open. b. Added in icons visuallyHidden c. Added sign in link in filters when user is not logged in d. Added uk-text-small class in "Clear". 7. monitor.component.ts: a. Removed anything related to offcavnas events b. Added method "logIn()".
This commit is contained in:
parent
362dd1cc80
commit
3af4eabea7
|
|
@ -3,12 +3,12 @@ import {HelperFunctions} from "../utils/HelperFunctions.class";
|
|||
import {Composer} from "../utils/email/composer";
|
||||
|
||||
export class NotificationUtils {
|
||||
public static IMPORT_INDICATORS: Notification = new Notification('IMPORT', ['monitor'], 'User ((__user__)) has imported new indicators in ((__stakeholder__)) profile', 'section')
|
||||
public static CREATE_STAKEHOLDER: Notification = new Notification('CREATE', ['monitor'], 'User ((__user__)) has created a new profile', 'stakeholder')
|
||||
public static EDIT_STAKEHOLDER: Notification = new Notification('EDIT', ['monitor'], 'User ((__user__)) has updated ((__stakeholder__)) profile', 'stakeholder')
|
||||
public static CREATE_INDICATOR: Notification = new Notification('CREATE', ['monitor'], 'User ((__user__)) has created a new indicator in ((__stakeholder__)) profile', 'indicator');
|
||||
public static EDIT_INDICATOR: Notification = new Notification('EDIT', ['monitor'], 'User ((__user__)) has updated an indicator in ((__stakeholder__)) profile', 'indicator');
|
||||
public static DELETE_INDICATOR: Notification = new Notification('DELETE', ['monitor'], 'User ((__user__)) has deleted an indicator in ((__stakeholder__)) profile', 'indicator');
|
||||
public static IMPORT_INDICATORS: Notification = new Notification('IMPORT', ['monitor'], 'User ((__user__)) has imported new indicators in ((__stakeholder__)) profile.', 'section')
|
||||
public static CREATE_STAKEHOLDER: Notification = new Notification('CREATE', ['monitor'], 'User ((__user__)) has created a new profile.', 'stakeholder')
|
||||
public static EDIT_STAKEHOLDER: Notification = new Notification('EDIT', ['monitor'], 'User ((__user__)) has updated ((__stakeholder__)) profile.', 'stakeholder')
|
||||
public static CREATE_INDICATOR: Notification = new Notification('CREATE', ['monitor'], 'User ((__user__)) has created a new indicator in ((__stakeholder__)) profile.', 'indicator');
|
||||
public static EDIT_INDICATOR: Notification = new Notification('EDIT', ['monitor'], 'User ((__user__)) has updated an indicator in ((__stakeholder__)) profile.', 'indicator');
|
||||
public static DELETE_INDICATOR: Notification = new Notification('DELETE', ['monitor'], 'User ((__user__)) has deleted an indicator in ((__stakeholder__)) profile.', 'indicator');
|
||||
public static INVITE_MONITOR_MANAGER: Notification = new Notification('INVITE_MANAGER', ['monitor'], null, 'user');
|
||||
public static INVITE_MONITOR_MEMBER: Notification = new Notification('INVITE_MEMBER', ['monitor'], null, 'user');
|
||||
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
#notifications .notification-list ul {
|
||||
overflow: auto;
|
||||
padding: 10px 45px 10px 0;
|
||||
height: calc(100% - 66px);
|
||||
height: calc(100% - 77px);
|
||||
}
|
||||
|
||||
#notifications .notification-list ul > li:nth-child(n+2){
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import {ChangeDetectorRef, Component, Input, OnDestroy, OnInit, ViewChild, ViewEncapsulation} from "@angular/core";
|
||||
import {Component, Input, OnDestroy, OnInit, ViewEncapsulation} from "@angular/core";
|
||||
import {Notification} from "../notifications";
|
||||
import {NotificationService} from "../notification.service";
|
||||
import {Subscription} from "rxjs";
|
||||
|
|
@ -11,33 +11,16 @@ declare var UIkit;
|
|||
@Component({
|
||||
selector: 'notification-sidebar',
|
||||
template: `
|
||||
<div id="notifications-switcher" uk-toggle href="#notifications"
|
||||
class="offcanvas-switcher uk-flex uk-flex-center uk-flex-middle"
|
||||
[class.open]="notificationsOpen">
|
||||
<!-- [ngClass]="notificationsStatus">-->
|
||||
|
||||
<icon name="mail" ratio="1.5" customClass="uk-text-primary-gradient" visuallyHidden="Notifications"></icon>
|
||||
<span [class.uk-hidden]="unreadCount === 0" id="notifications-count" class="offcanvas-count">
|
||||
<div id="notifications-switcher" uk-toggle href="#notifications" class="offcanvas-switcher uk-flex uk-flex-center uk-flex-middle">
|
||||
<icon name="mail" ratio="1.5" customClass="uk-text-primary-gradient" flex="true" visuallyHidden="Notifications"></icon>
|
||||
<span [class.uk-hidden]="unreadCount === 0" id="notifications-count" class="offcanvas-count uk-flex uk-flex-middle uk-flex-center">
|
||||
{{unreadCount}}
|
||||
</span>
|
||||
</div>
|
||||
<div id="notifications" class="uk-offcanvas offcanvas" uk-offcanvas="flip: true; overlay: true;">
|
||||
<!-- <div #test id="notifications-switcher-inner" uk-toggle href="#notifications" -->
|
||||
<!-- class="open uk-flex uk-flex-center uk-flex-middle uk-animation-fade" [ngClass]="notificationsStatus">-->
|
||||
<!--<!– uk-animation-fade"–>-->
|
||||
<!--<!– [class.uk-animation-fast]="!notificationsOpen" [class.uk-animation-reverse]="!notificationsOpen">–>-->
|
||||
<!-- <icon name="mail" ratio="1.5"></icon>-->
|
||||
<!-- <!– <span [class.uk-hidden]="unreadCount === 0" id="notifications-count">–>-->
|
||||
<!-- <!– {{unreadCount}}–>-->
|
||||
<!-- <!– </span>–>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<div class="uk-offcanvas-bar">
|
||||
<!-- <button class="uk-offcanvas-close offcanvas-close" type="button">-->
|
||||
<!-- <icon name="close" ratio="1.5"></icon>-->
|
||||
<!-- </button>-->
|
||||
<button class="uk-offcanvas-close offcanvas-close uk-close uk-icon" type="button">
|
||||
<icon name="close" ratio="1.5"></icon>
|
||||
<icon name="close" ratio="1.5" visuallyHidden="close"></icon>
|
||||
</button>
|
||||
|
||||
<ng-template [ngIf]="!notification">
|
||||
|
|
@ -60,7 +43,7 @@ declare var UIkit;
|
|||
</p>
|
||||
</div>
|
||||
<div class="uk-margin-left uk-flex uk-flex-center uk-text-secondary">
|
||||
<icon *ngIf="!notification.read" name="bullet" ratio="0.6"></icon>
|
||||
<icon *ngIf="!notification.read" name="bullet" ratio="0.6" visuallyHidden="unread"></icon>
|
||||
</div>
|
||||
</div>
|
||||
<span class="uk-text-secondary uk-text-small">{{getDate(notification.date)}}</span>
|
||||
|
|
@ -74,7 +57,7 @@ declare var UIkit;
|
|||
<div *ngIf="notification" class="notification">
|
||||
<div class="uk-flex uk-flex-middle uk-margin-medium-bottom">
|
||||
<span class="uk-text-secondary clickable" (click)="back($event)">
|
||||
<icon ratio="1.5" name="arrow_left"></icon>
|
||||
<icon ratio="1.5" name="arrow_left" visuallyHidden="back"></icon>
|
||||
</span>
|
||||
<h4 *ngIf="notification.title" class="uk-text-bold uk-margin-left">{{notification.title}}</h4>
|
||||
</div>
|
||||
|
|
@ -106,10 +89,8 @@ export class NotificationsSidebarComponent implements OnInit, OnDestroy {
|
|||
public service: string;
|
||||
public notification: Notification;
|
||||
private subscriptions: any[] = [];
|
||||
public notificationsOpen: boolean = false;
|
||||
// public notificationsStatus: string = "closed";
|
||||
|
||||
constructor(private notificationService: NotificationService, private cdr: ChangeDetectorRef) {
|
||||
constructor(private notificationService: NotificationService) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
|
@ -123,31 +104,6 @@ export class NotificationsSidebarComponent implements OnInit, OnDestroy {
|
|||
pos: 'bottom-right'
|
||||
});
|
||||
}));
|
||||
|
||||
UIkit.util.on('#notifications', 'beforeshow', () => {
|
||||
// do something
|
||||
console.log("notifications beforeshow...");
|
||||
this.notificationsOpen = true;
|
||||
this.cdr.detectChanges();
|
||||
// self.notificationsStatus = "opening";
|
||||
|
||||
});
|
||||
|
||||
// UIkit.util.on('#notifications', 'shown', function () {
|
||||
// // do something
|
||||
// console.log("notifications open");
|
||||
// self.notificationsStatus = "open";
|
||||
//
|
||||
// });
|
||||
|
||||
UIkit.util.on('#notifications', 'beforehide', () => {
|
||||
// do something
|
||||
console.log("notifications beforehide...");
|
||||
this.notificationsOpen = false;
|
||||
this.cdr.detectChanges();
|
||||
|
||||
// self.notificationsStatus = "closing";
|
||||
});
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
|
|
@ -156,7 +112,6 @@ export class NotificationsSidebarComponent implements OnInit, OnDestroy {
|
|||
subscription.unsubscribe();
|
||||
}
|
||||
})
|
||||
// UIkit.util.$destroy();
|
||||
}
|
||||
|
||||
get unreadCount(): number {
|
||||
|
|
|
|||
Loading…
Reference in New Issue