Change modal title background in dashboard modals

dashboard/divId/divIds.component.html

@@ -29,11 +29,8 @@
         <div class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
           <div search-input [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer" placeholder="Search class" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
           <div>
-            <button class="uk-button uk-button-secondary" [class]="getSelectedDivIds().length == 0 ? 'uk-disabled':''" [disabled]="getSelectedDivIds().length == 0">
-							Bulk Actions
-							<span *ngIf="getSelectedDivIds().length > 0">
-								({{getSelectedDivIds().length}})
-							</span>
+            <button class="uk-button uk-button-secondary" [class.uk-disabled]="getSelectedDivIds().length == 0" [disabled]="getSelectedDivIds().length == 0">
+							Bulk Actions ({{getSelectedDivIds().length}})
 						</button>
             <div uk-dropdown="mode: click">
               <ul class="uk-nav uk-dropdown-nav"

dashboard/divhelpcontent/class-help-contents.component.html

@@ -118,4 +118,5 @@
     </div>
   </div>
 </div>
-<modal-alert #AlertModalDeletePageHelpContents (alertOutput)="confirmedDeletePageHelpContents($event)"></modal-alert>
+<modal-alert #AlertModalDeletePageHelpContents [overflowBody]="false" classTitle="uk-background-primary uk-light"
+             (alertOutput)="confirmedDeletePageHelpContents($event)"></modal-alert>

dashboard/entity/entities.component.html

@@ -28,14 +28,12 @@
 								(click)="filterForm.get('status').setValue('disabled')"><span class="title">Disabled</span></a></li>
 					</ul>
 				</div>
-				<div class="uk-width-1-1 uk-flex uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
-					<div search-input [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer" placeholder="Search entity" class="uk-width-expand"></div>
+				<div class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
+					<div search-input [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer" placeholder="Search entity"
+							 class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
 					<div>
-						<button	utton class="uk-button uk-button-secondary" [class]="getSelectedEntities().length == 0 ? 'uk-disabled':''" [disabled]="getSelectedEntities().length == 0">
-							Bulk Actions
-							<span *ngIf="getSelectedEntities().length > 0">
-								({{getSelectedEntities().length}})
-							</span>
+						<button class="uk-button uk-button-secondary" [class.uk-disabled]="getSelectedEntities().length == 0" [disabled]="getSelectedEntities().length == 0">
+							Bulk Actions ({{getSelectedEntities().length}})
 						</button>
             <div uk-dropdown="mode: click">
               <ul class="uk-nav uk-dropdown-nav"

dashboard/helpTexts/page-help-contents.component.html

@@ -119,4 +119,5 @@
     </div>
   </div>
 </div>
-<modal-alert #AlertModalDeletePageHelpContents (alertOutput)="confirmedDeletePageHelpContents($event)"></modal-alert>
+<modal-alert #AlertModalDeletePageHelpContents [overflowBody]="false" classTitle="uk-background-primary uk-light"
+             (alertOutput)="confirmedDeletePageHelpContents($event)"></modal-alert>

dashboard/page/pages.component.html

@@ -26,14 +26,12 @@
 								(click)="filterForm.get('type').setValue(type.value)"><span>{{type.label}}</span></a></li>
 					</ul>
 				</div>
-				<div class="uk-width-1-1 uk-flex uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
-					<div search-input [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer" placeholder="Search page" class="uk-width-expand"></div>
+				<div class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
+					<div search-input [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer" placeholder="Search page"
+							 class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
 					<div>
-						<button	utton class="uk-button uk-button-secondary" [class]="getSelectedPages().length == 0 ? 'uk-disabled':''" [disabled]="getSelectedPages().length == 0">
-							Bulk Actions
-							<span *ngIf="getSelectedPages().length > 0">
-								({{getSelectedPages().length}})
-							</span>
+						<button class="uk-button uk-button-secondary" [class.uk-disabled]="getSelectedPages().length == 0" [disabled]="getSelectedPages().length == 0">
+							Bulk Actions ({{getSelectedPages().length}})
 						</button>
             <div uk-dropdown="mode: click">
               <ul class="uk-nav uk-dropdown-nav"

dashboard/portal/portals.component.html

@@ -30,11 +30,8 @@
           <div search-input [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer"  placeholder="Search portal"
 						[bordered]="true" colorClass="uk-text-secondary" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
           <div>
-            <button class="uk-button uk-button-secondary" [class]="getSelectedPortals().length == 0 ? 'uk-disabled':''" [disabled]="getSelectedPortals().length == 0">
-							Bulk Actions
-							<span *ngIf="getSelectedPortals().length > 0">
-								({{getSelectedPortals().length}})
-							</span>
+            <button class="uk-button uk-button-secondary" [class.uk-disabled]="getSelectedPortals().length == 0" [disabled]="getSelectedPortals().length == 0">
+							Bulk Actions ({{getSelectedPortals().length}})
 						</button>
             <div uk-dropdown="mode: click">
               <ul class="uk-nav uk-dropdown-nav"

dashboard/users/role-users/role-users.component.html

@@ -75,7 +75,8 @@
     </div>
   </div>
 </div>
-<modal-alert #inviteModal (alertOutput)="invite()" [overflowBody]="false" [okDisabled]="invited && invited.invalid">
+<modal-alert #inviteModal (alertOutput)="invite()" [overflowBody]="false" classTitle="uk-background-primary uk-light"
+						 [okDisabled]="invited && invited.invalid">
 	<div *ngIf="message" class="uk-margin-medium-bottom uk-text-small">
 		<div [innerHTML]="message | safeHtml"></div>
 	</div>
@@ -84,17 +85,18 @@
 				 placeholder="Email"></div>
 	</div>
 </modal-alert>
-<modal-alert #deleteModal [overflowBody]="false" (alertOutput)="deleteActive()">
+<modal-alert #deleteModal [overflowBody]="false" (alertOutput)="deleteActive()" classTitle="uk-background-primary uk-light">
   <div *ngIf="selectedUser">
     Are you sure you want to remove <span class="uk-text-bold">{{selectedUser}}</span> from {{role}}s?
   </div>
 </modal-alert>
-<modal-alert #deletePendingModal [overflowBody]="false" (alertOutput)="deletePending()">
+<modal-alert #deletePendingModal [overflowBody]="false" (alertOutput)="deletePending()" classTitle="uk-background-primary uk-light">
   <div *ngIf="selectedUser">
     Are you sure you want to cancel {{role}} invitation of <span class="uk-text-bold">{{selectedUser}}</span>?
   </div>
 </modal-alert>
-<modal-alert #createRoleModal [overflowBody]="false" (alertOutput)="createGroup()" [okDisabled]="roleFb && roleFb.invalid">
+<modal-alert #createRoleModal [overflowBody]="false" (alertOutput)="createGroup()" classTitle="uk-background-primary uk-light"
+						 [okDisabled]="roleFb && roleFb.invalid">
   <div *ngIf="roleFb">
     <div class="uk-grid" uk-grid [formGroup]="roleFb">
       <div input [formInput]="roleFb.get('name')"

dashboard/users/subscribers/subscribers.component.html

@@ -78,15 +78,16 @@
   </div>
 </div>
 <modal-alert *ngIf="user" #inviteModal (alertOutput)="subscriberInvite.invite()" [okDisabled]="!subscriberInvite.valid"
-             [large]="true">
+             [large]="true" classTitle="uk-background-primary uk-light">
     <subscriber-invite #subscriberInvite [user]="user"></subscriber-invite>
 </modal-alert>
-<modal-alert #deleteModal [overflowBody]="false" (alertOutput)="deleteSubscriber()">
+<modal-alert #deleteModal [overflowBody]="false" (alertOutput)="deleteSubscriber()" classTitle="uk-background-primary uk-light">
   <div *ngIf="selectedUser">
     Are you sure you want to remove <span class="uk-text-bold">{{selectedUser}}</span> from subscribers?
   </div>
 </modal-alert>
-<modal-alert #createRoleModal (alertOutput)="createGroup()" [okDisabled]="roleFb && roleFb.invalid">
+<modal-alert #createRoleModal (alertOutput)="createGroup()" classTitle="uk-background-primary uk-light"
+             [okDisabled]="roleFb && roleFb.invalid">
   <div *ngIf="roleFb" class="uk-padding uk-padding-remove-horizontal">
     <div class="uk-grid" uk-grid [formGroup]="roleFb">
       <div dashboard-input [formInput]="roleFb.get('name')"