[Library | Trunk]: Grow loading stoke
git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@59719 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
parent
a1bccfe527
commit
7d0851fae7
|
@ -1,5 +1,5 @@
|
|||
<div>
|
||||
<ul class="uk-tab customTabs admin" uk-tab>
|
||||
<ul class="uk-tab customTabs admin uk-flex uk-flex-center uk-flex-left@m" uk-tab>
|
||||
<li [class.uk-active]="tab === 'managers'"><a (click)="changeTab('managers')"><span class="title">Managers</span></a></li>
|
||||
<li [class.uk-active]="tab === 'members'"><a (click)="changeTab('members')"><span class="title">Members</span></a></li>
|
||||
</ul>
|
||||
|
|
|
@ -5,8 +5,8 @@
|
|||
{{error}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-grid" uk-grid>
|
||||
<div class="uk-width-expand">
|
||||
<div class="uk-grid uk-flex uk-flex-middle" uk-grid>
|
||||
<div class="uk-width-expand uk-flex uk-flex-left@m uk-flex-center">
|
||||
<ul class="uk-subnav uk-subnav-pill">
|
||||
<li [class.uk-active]="showManagers" (click)="showManagers = true">
|
||||
<a>Managers</a>
|
||||
|
@ -16,7 +16,7 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="uk-width-1-5 uk-flex uk-flex-right">
|
||||
<div class="uk-width-1-5@l uk-width-1-3@m uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center">
|
||||
<a class="uk-text-uppercase uk-flex uk-flex-middle" (click)="openInviteModal()">
|
||||
<button class="uk-icon-button large uk-button-secondary">
|
||||
<icon name="person_add"></icon>
|
||||
|
@ -30,7 +30,7 @@
|
|||
</div>
|
||||
<div *ngIf="!loadManagers && !loadPending" class="uk-margin-medium-top uk-padding-small">
|
||||
<div *ngIf="(showManagers && managers.length == 0) || (!showManagers && pending.length == 0)"
|
||||
class="uk-card uk-card-default uk-padding-large uk-card-body uk-text-center uk-margin-bottom uk-text-bold">
|
||||
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
|
||||
<div *ngIf="showManagers">No managers for {{name}}</div>
|
||||
<div *ngIf="!showManagers">No pending manager invitations for {{name}}</div>
|
||||
</div>
|
||||
|
@ -38,14 +38,14 @@
|
|||
class="uk-overflow-auto uk-height-max-large">
|
||||
<div class="uk-card uk-card-default uk-card-body uk-text-small uk-margin-bottom" *ngFor="let item of (showManagers)?managers:pending">
|
||||
<div class="uk-grid uk-grid-divider uk-flex uk-flex-middle" uk-grid>
|
||||
<div class="uk-width-3-4">
|
||||
<div class="uk-width-3-4@l uk-width-1-2@m">
|
||||
<div class="uk-padding-small uk-padding-remove-horizontal">
|
||||
<span class="uk-text-muted">Email: </span>
|
||||
<span class="uk-text-bold">{{(showManagers) ? item.email : item}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="properties.environment === 'development'" class="uk-width-expand uk-text-center">
|
||||
<div class="uk-padding-small uk-padding-remove-horizontal">
|
||||
<div *ngIf="properties.environment === 'development'" class="uk-width-expand">
|
||||
<div class="uk-padding-small uk-padding-remove-horizontal uk-flex uk-flex-center">
|
||||
<a (click)="openDeleteModal(item)" class="uk-button action uk-flex uk-flex-middle">
|
||||
<icon name="remove_circle_outline" ratio="0.7" [flex]="true"></icon>
|
||||
<span class="uk-margin-small-left">{{showManagers?'Remove manager':'Cancel invitation'}}</span>
|
||||
|
@ -64,12 +64,12 @@
|
|||
</div>
|
||||
</modal-alert>
|
||||
<modal-alert #deleteManagerModal (alertOutput)="deleteManager()">
|
||||
<div *ngIf="selectedUser" class="uk-padding uk-padding-remove-horizontal">
|
||||
<div *ngIf="selectedUser" class="uk-padding-small uk-padding-remove-horizontal">
|
||||
Are you sure you want to remove <span class="uk-text-bold">{{selectedUser}}</span> from managers?
|
||||
</div>
|
||||
</modal-alert>
|
||||
<modal-alert #deletePendingModal (alertOutput)="deletePendingManager()">
|
||||
<div *ngIf="selectedUser" class="uk-padding uk-padding-remove-horizontal">
|
||||
<div *ngIf="selectedUser" class="uk-padding-small uk-padding-remove-horizontal">
|
||||
Are you sure you want to cancel manager invitation of <span class="uk-text-bold">{{selectedUser}}</span>?
|
||||
</div>
|
||||
</modal-alert>
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="uk-grid" uk-grid>
|
||||
<div class="uk-width-expand">
|
||||
<div class="uk-width-expand uk-flex uk-flex-left@m uk-flex-center">
|
||||
<ul class="uk-subnav uk-subnav-pill">
|
||||
<li [class.uk-active]="showMembers" (click)="showMembers = true">
|
||||
<a>Members</a>
|
||||
|
@ -16,7 +16,7 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="uk-width-1-4 uk-flex uk-flex-right">
|
||||
<div class="uk-width-1-5@l uk-width-1-3@m uk-flex uk-flex-right@m uk-flex-center">
|
||||
<a class="uk-text-uppercase uk-flex uk-flex-middle" (click)="openInviteModal()">
|
||||
<button class="uk-icon-button large uk-button-secondary">
|
||||
<icon name="person_add"></icon>
|
||||
|
@ -30,7 +30,7 @@
|
|||
</div>
|
||||
<div *ngIf="!loadMembers && !loadPending" class="uk-margin-medium-top">
|
||||
<div *ngIf="(showMembers && members.length == 0) || (!showMembers && pending.length == 0)"
|
||||
class="uk-card uk-card-default uk-padding-large uk-card-body uk-text-center uk-margin-bottom uk-text-bold">
|
||||
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
|
||||
<div *ngIf="showMembers">No members for {{name}}</div>
|
||||
<div *ngIf="!showMembers">No pending member invitations for {{name}}</div>
|
||||
</div>
|
||||
|
@ -38,14 +38,14 @@
|
|||
class="uk-overflow-auto uk-height-max-large uk-padding-small">
|
||||
<div class="uk-card uk-card-default uk-card-body uk-text-small uk-margin-bottom" *ngFor="let item of (showMembers)?members:pending">
|
||||
<div class="uk-grid uk-grid-divider uk-flex uk-flex-middle" uk-grid>
|
||||
<div class="uk-width-3-4">
|
||||
<div class="uk-width-3-4@l uk-width-1-2@m">
|
||||
<div class="uk-padding-small uk-padding-remove-horizontal">
|
||||
<span class="uk-text-muted">Email: </span>
|
||||
<span class="uk-text-bold">{{(showMembers) ? item.email : item}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="properties.environment === 'development'" class="uk-width-expand uk-text-center">
|
||||
<div class="uk-padding-small uk-padding-remove-horizontal">
|
||||
<div *ngIf="properties.environment === 'development'" class="uk-width-expand">
|
||||
<div class="uk-padding-small uk-padding-remove-horizontal uk-flex uk-flex-center">
|
||||
<a (click)="openDeleteModal(item)" class="uk-button action uk-flex uk-flex-middle">
|
||||
<icon name="remove_circle_outline" ratio="0.7" [flex]="true"></icon>
|
||||
<span class="uk-margin-small-left">{{showMembers ? 'Remove member' : 'Cancel invitation'}}</span>
|
||||
|
|
|
@ -4,12 +4,10 @@ import {Component, Input} from "@angular/core";
|
|||
selector: 'loading',
|
||||
template: `
|
||||
<div class="uk-flex uk-flex-center uk-margin-small-top">
|
||||
<!--<div class="md-preloader" [ngClass]="(color)?('md-preloader-' + color):''">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="48" width="48" viewBox="0 0 75 75">
|
||||
<circle cx="37.5" cy="37.5" r="33.5" stroke-width="4"></circle>
|
||||
</svg>
|
||||
</div>-->
|
||||
<span class="portal-color" uk-spinner="ratio: 2"></span>
|
||||
<span class="portal-color uk-icon uk-spinner">
|
||||
<svg width="60" height="60" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg" data-svg="spinner"><circle
|
||||
fill="none" stroke="#000" cx="15" cy="15" r="14" style="stroke-width: 2px;"></circle></svg>
|
||||
</span>
|
||||
</div>`
|
||||
})
|
||||
export class LoadingComponent {
|
||||
|
@ -17,7 +15,7 @@ export class LoadingComponent {
|
|||
* Possible values '': blue, 'success': green, 'warning': orange and 'danger': red
|
||||
*/
|
||||
@Input() color: 'success' | 'warning' | 'danger' = null;
|
||||
|
||||
|
||||
constructor() {
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue