diff --git a/src/app/appmarket/admin/configuration/details/configurationdetails.component.html b/src/app/appmarket/admin/configuration/details/configurationdetails.component.html
index ce27f1b5be109d61b374c1b97bcd5fa5d2cbc1a0..120f90dc214c1069294c29a1ea17b387dc260d4a 100644
--- a/src/app/appmarket/admin/configuration/details/configurationdetails.component.html
+++ b/src/app/appmarket/admin/configuration/details/configurationdetails.component.html
@@ -87,81 +87,85 @@
[(ngModel)]="this.configuration.registrationDomainSelectionEnabled">
</div>
</div>
-
<div class="form-group">
- <label for="bulkDomainsAllowForSsoAccounts"
- class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.BULK_DOMAINS_ALLOW_FOR_SSO_ACCOUNTS' | translate}}</label>
+ <label for="deploymentPrefix"
+ class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.DEPLOYMENT_PREFIX' | translate}}</label>
<div class="col-sm-9 pd-top-7">
- <input type="checkbox" id="bulkDomainsAllowForSsoAccounts" name="bulkDomainsAllowForSsoAccounts"
- [(ngModel)]="this.configuration.bulkDomainsAllowForSsoAccounts"
- [checked]="this.configuration.bulkDomainsAllowForSsoAccounts === true">
+ <div class="input-width">
+ <input class="form-control" type="text" id="deploymentPrefix" name="deploymentPrefix"
+ [(ngModel)]="this.configuration.deploymentPrefix">
+ </div>
+
</div>
</div>
- <div class="form-group">
- <label for="bulkDomainsSendEmailForNewAccounts"
- class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.BULK_DOMAINS_SEND_EMAIL_FOR_NEW_ACCOUNTS' | translate}}</label>
- <div class="col-sm-9 pd-top-7">
- <input type="checkbox" id="bulkDomainsSendEmailForNewAccounts" name="bulkDomainsSendEmailForNewAccounts"
- [(ngModel)]="this.configuration.bulkDomainsSendEmailForNewAccounts"
- [checked]="this.configuration.bulkDomainsSendEmailForNewAccounts === true">
+ <div class="panel-default panel-heading">Bulk settings</div>
+ <div class="panel-body">
+
+ <div class="form-group">
+ <label for="bulkDomainsAllowForSsoAccounts"
+ class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.BULK_DOMAINS_ALLOW_FOR_SSO_ACCOUNTS' | translate}}</label>
+ <div class="col-sm-9 pd-top-7">
+ <input type="checkbox" id="bulkDomainsAllowForSsoAccounts" name="bulkDomainsAllowForSsoAccounts"
+ [(ngModel)]="this.configuration.bulkDomainsAllowForSsoAccounts"
+ [checked]="this.configuration.bulkDomainsAllowForSsoAccounts === true">
+ </div>
</div>
- </div>
- <div class="form-group">
- <label for="bulkDeploymentJobCron"
- class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.BULK_DEPLOYMENT_CRON' | translate}}</label>
- <div class="col-sm-9 pd-top-7 ">
- <div class="input-width">
- <input class="form-control" type="text" id="bulkDeploymentJobCron" name="bulkDeploymentJobCron"
- [(ngModel)]="this.configuration.bulkDeploymentJobCron">
+ <div class="form-group">
+ <label for="bulkDomainsSendEmailForNewAccounts"
+ class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.BULK_DOMAINS_SEND_EMAIL_FOR_NEW_ACCOUNTS' | translate}}</label>
+ <div class="col-sm-9 pd-top-7">
+ <input type="checkbox" id="bulkDomainsSendEmailForNewAccounts" name="bulkDomainsSendEmailForNewAccounts"
+ [(ngModel)]="this.configuration.bulkDomainsSendEmailForNewAccounts"
+ [checked]="this.configuration.bulkDomainsSendEmailForNewAccounts === true">
</div>
-
</div>
- </div>
- <div class="form-group">
- <label for="parallelDeploymentsLimit"
- class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.BULK_DEPLOYMENT_LIMIT' | translate}}</label>
- <div class="col-sm-9 pd-top-7">
- <div class="input-width">
- <input class="form-control" type="number" id="parallelDeploymentsLimit" name="parallelDeploymentsLimit"
- [(ngModel)]="this.configuration.parallelDeploymentsLimit">
+ <div class="form-group">
+ <label for="bulkDeploymentJobCron"
+ class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.BULK_DEPLOYMENT_CRON' | translate}}</label>
+ <div class="col-sm-9 pd-top-7 ">
+ <div class="input-width">
+ <input class="form-control" type="text" id="bulkDeploymentJobCron" name="bulkDeploymentJobCron"
+ [(ngModel)]="this.configuration.bulkDeploymentJobCron">
+ </div>
+
</div>
-
</div>
- </div>
- <div class="form-group">
- <label for="bulkDeploymentQueueRefresh"
- class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.BULK_DEPLOYMENT_QUEUE_REFRESH' | translate}}</label>
- <div class="col-sm-9 pd-top-7">
- <div class="input-width">
- <input class="form-control" type="number" id="bulkDeploymentQueueRefresh" name="bulkDeploymentQueueRefresh"
- [(ngModel)]="this.configuration.bulkDeploymentQueueRefresh">
+
+ <div class="form-group">
+ <label for="parallelDeploymentsLimit"
+ class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.BULK_DEPLOYMENT_LIMIT' | translate}}</label>
+ <div class="col-sm-9 pd-top-7">
+ <div class="input-width">
+ <input class="form-control" type="number" id="parallelDeploymentsLimit" name="parallelDeploymentsLimit"
+ [(ngModel)]="this.configuration.parallelDeploymentsLimit">
+ </div>
+
</div>
-
</div>
- </div>
- <div class="form-group">
- <label for="bulkDeploymentTimeThreshold"
- class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.BULK_DEPLOYMENT_THRESHOLD' | translate}}</label>
- <div class="col-sm-9 pd-top-7">
- <div class="input-width">
- <input class="form-control" type="number" id="bulkDeploymentTimeThreshold" name="bulkDeploymentTimeThreshold"
- [(ngModel)]="this.configuration.bulkDeploymentTimeThreshold">
+ <div class="form-group">
+ <label for="bulkDeploymentQueueRefresh"
+ class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.BULK_DEPLOYMENT_QUEUE_REFRESH' | translate}}</label>
+ <div class="col-sm-9 pd-top-7">
+ <div class="input-width">
+ <input class="form-control" type="number" id="bulkDeploymentQueueRefresh" name="bulkDeploymentQueueRefresh"
+ [(ngModel)]="this.configuration.bulkDeploymentQueueRefresh">
+ </div>
+
</div>
-
</div>
- </div>
- <div class="form-group">
- <label for="deploymentPrefix"
- class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.DEPLOYMENT_PREFIX' | translate}}</label>
- <div class="col-sm-9 pd-top-7">
- <div class="input-width">
- <input class="form-control" type="text" id="deploymentPrefix" name="deploymentPrefix"
- [(ngModel)]="this.configuration.deploymentPrefix">
+ <div class="form-group">
+ <label for="bulkDeploymentTimeThreshold"
+ class="col-sm-3 control-label">{{'PORTAL_CONFIGURATION.BULK_DEPLOYMENT_THRESHOLD' | translate}}</label>
+ <div class="col-sm-9 pd-top-7">
+ <div class="input-width">
+ <input class="form-control" type="number" id="bulkDeploymentTimeThreshold" name="bulkDeploymentTimeThreshold"
+ [(ngModel)]="this.configuration.bulkDeploymentTimeThreshold">
+ </div>
+
</div>
-
</div>
</div>
<div class="flex justify-content-end">
diff --git a/src/app/appmarket/admin/languagemanagement/languagelist/languagelist.component.css b/src/app/appmarket/admin/languagemanagement/languagelist/languagelist.component.css
index 4c3941d86d1a667e26892873acca26b27c3a880f..ef5401480eb1663ac2c9dec13c5a1014d6ea0a61 100644
--- a/src/app/appmarket/admin/languagemanagement/languagelist/languagelist.component.css
+++ b/src/app/appmarket/admin/languagemanagement/languagelist/languagelist.component.css
@@ -16,26 +16,3 @@ tr.clickable {
/*.dropdown:hover .dropdown-menu {*/
/* display: block;*/
/*}*/
-:host ::ng-deep .p-datatable .p-datatable-thead > tr > th{
- border: 1px solid #E0E2E5;
- background:transparent;
- border-width: 0 0 1px 0;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr > td {
- text-align: left;
- border: 1px solid #E0E2E5;
- border-width: 0 0 1px 0;
- padding: 1rem 1rem;
-}
-:host ::ng-deep .p-datatable .p-paginator-bottom{
- height: 40px;
- background: transparent;
- border: none;
- margin-top:10px;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr{
- background: transparent;
-}
-:host ::ng-deep .p-datatable>.p-datatable-wrapper {
- overflow: visible;
-}
diff --git a/src/app/appmarket/appdetails/appdetails.component.html b/src/app/appmarket/appdetails/appdetails.component.html
index 9307f36cea14190d00dc5963ea429958897dd30c..7caaea2e74a14291fecff80651685535df415117 100644
--- a/src/app/appmarket/appdetails/appdetails.component.html
+++ b/src/app/appmarket/appdetails/appdetails.component.html
@@ -10,7 +10,7 @@
<h3 style="margin:0 20px;">{{app?.name}}</h3>
</div>
<div class="" *ngIf="app && domain" style="display:flex; align-items: center">
- <div *ngIf="!subscribed && isSubscriptionAllowed()" class="btn-group pull-right"
+ <div *ngIf="!subscribed && isSubscriptionAllowed()" class="pull-right"
pTooltip="{{'APPLICATIONS.TOOLTIP_MESSAGE_SUBSCRIBE' | translate}}" tooltipPosition="bottom" [showDelay]="50" [tooltipDisabled]="defaultTooltipDisabled">
<button class="btn btn-primary m-1" [disabled]="!active || !isApplicationEnabledInDomain()" (click)="subscribe()">{{'APPLICATIONS.SUBSCRIBE_BUTTON' | translate}}</button>
<button class="btn btn-primary m-1"[routerLink]="['/admin/apps/bulks']">Bulk deployments</button>
@@ -20,7 +20,7 @@
<div class="btn no-padding" pTooltip="{{'APPLICATIONS.TOOLTIP_MESSAGE_DEPLOY' | translate}}" tooltipPosition="bottom" [showDelay]="50" [tooltipDisabled]="defaultTooltipDisabled">
<button *ngIf="isSubscriptionAllowed()" class="btn btn-danger m-1" (click)="unsubscribe()">{{'APPLICATIONS.UNSUBSCRIBE_BUTTON' | translate}}</button>
</div>
- <button class="btn btn-primary m-1"[routerLink]="['/admin/apps/bulks']">Bulk deployments</button>
+ <button class="btn btn-primary m-1" [routerLink]="['/admin/apps/bulks']">Bulk deployments</button>
<button *ngIf="isSubscriptionAllowed()" class="btn btn-primary m-1" [disabled]="!isApplicationEnabledInDomain()" (click)="appInstallModal.show()">{{'APPLICATIONS.DEPLOY_BUTTON' | translate}}</button>
</div>
@@ -84,7 +84,7 @@
</div>
<div style="padding-top:50px">
<p style="font-weight: bold" *ngIf="numberOfScreenshots > 0">{{'SCREENSHOTS.HEADER' | translate}}</p>
- <screenshots (numberOfScreenshots)="screenshots($event)" [pathUrl]="'/apps/' + appId + '/screenshots'"></screenshots>
+ <screenshots style="display: flex" (numberOfScreenshots)="screenshots($event)" [pathUrl]="'/apps/' + appId + '/screenshots'"></screenshots>
</div>
</div>
diff --git a/src/app/appmarket/appinstance/appinstance/appinstance.component.css b/src/app/appmarket/appinstance/appinstance/appinstance.component.css
index 82b1538c8590a63a2c7b88b8d2c025bf9e461744..3fe8d07992c63f0ea74cc5d8d25653db29998897 100644
--- a/src/app/appmarket/appinstance/appinstance/appinstance.component.css
+++ b/src/app/appmarket/appinstance/appinstance/appinstance.component.css
@@ -85,3 +85,6 @@
:host ::ng-deep.p-dropdown-panel .p-dropdown-items {
max-height: 150px;
}
+:host ::ng-deep .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{
+ background: var(--user-button-background-hover)
+}
diff --git a/src/app/appmarket/appinstance/appinstance/appinstance.component.html b/src/app/appmarket/appinstance/appinstance/appinstance.component.html
index abecb2b58014fe284786ebdbe59d2f99443b6983..dae5bdb3129447e7c0b42026df44635231b470d3 100644
--- a/src/app/appmarket/appinstance/appinstance/appinstance.component.html
+++ b/src/app/appmarket/appinstance/appinstance/appinstance.component.html
@@ -150,9 +150,8 @@
{{'APP_INSTANCE.VIEW_LOGS' | translate}}
</a>
</li>
- <li *roles="['ROLE_DOMAIN_ADMIN', 'ROLE_SYSTEM_ADMIN']"
- style="background-color: #ff0000;">
- <a role="button" (click)="this.undeployModal.show()" style="color: #ffffff;">
+ <li *roles="['ROLE_DOMAIN_ADMIN', 'ROLE_SYSTEM_ADMIN']">
+ <a role="button" (click)="this.undeployModal.show()" style="color: var(--danger-button-color)">
{{'APP_INSTANCE.UNDEPLOY_BUTTON' | translate}}
</a>
</li>
@@ -175,7 +174,7 @@
</a>
</li>
<li>
- <a role="button" style="color: red"
+ <a role="button" style="color: var(--danger-button-color)"
*roles="['ROLE_DOMAIN_ADMIN', 'ROLE_SYSTEM_ADMIN']"
(click)="removeConfirm.show()">{{'APP_INSTANCE.REMOVE_BUTTON' | translate}}
</a>
diff --git a/src/app/appmarket/appinstance/appinstancelist/appinstancelist.component.css b/src/app/appmarket/appinstance/appinstancelist/appinstancelist.component.css
index 4e7c658771b40fe54ddeb0e02fe92d69261037a6..a1f3548446b32f144eaa14a1c003ce1a2b358506 100644
--- a/src/app/appmarket/appinstance/appinstancelist/appinstancelist.component.css
+++ b/src/app/appmarket/appinstance/appinstancelist/appinstancelist.component.css
@@ -39,52 +39,7 @@ label{
margin-bottom: 0;
font-weight: unset;
}
-:host ::ng-deep .p-datatable .p-datatable-thead > tr > th{
- border: 1px solid #E0E2E5;
- border-width: 0 0 1px 0;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr > td {
- text-align: left;
- border: 1px solid #E0E2E5;
- border-width: 0 0 1px 0;
- padding: 1rem 1rem;
-}
-:host ::ng-deep .p-datatable .p-paginator-bottom{
- height: 40px;
- background: transparent;
- border: none;
- margin-top:10px;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr{
- background: transparent;
-}
-
-:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{
- transition: unset;
- border-radius: 50%;
- min-width:3.5rem;
- height:3.5rem;
- margin:0 5px;
- font-size: 14px;
-}
-:host ::ng-deep .p-paginator-element{
- border-radius:50%;
- margin:0 5px;
- min-width:3.5rem;
- height:3.5rem;
- font-size: 14px;
-}
-:host ::ng-deep .p-paginator .p-dropdown{
- height:3rem;
-}
-:host ::ng-deep .p-paginator-icon{
- height: 1.5rem;
- width: 1.5rem;
-}
-:host ::ng-deep .p-paginator .p-dropdown .p-dropdown-label{
- padding-right: 10px;
-}
::ng-deep.p-selectbutton .p-button.p-highlight{
background: var(--primary-button-color) !important;
border-color: var(--primary-button-color);
diff --git a/src/app/appmarket/appmanagement/app-management-list/appmanagementlist.component.css b/src/app/appmarket/appmanagement/app-management-list/appmanagementlist.component.css
index cd6a22945f00765bcea111aac4bf1502a039359d..83c4455b01ded2b71a8f81afc08872d537108a63 100644
--- a/src/app/appmarket/appmanagement/app-management-list/appmanagementlist.component.css
+++ b/src/app/appmarket/appmanagement/app-management-list/appmanagementlist.component.css
@@ -16,26 +16,4 @@
/*.dropdown:hover .dropdown-menu {*/
/* display: block;*/
/*}*/
-:host ::ng-deep .p-datatable .p-datatable-thead > tr > th{
- border: 1px solid #E0E2E5;
- background:transparent;
- border-width: 0 0 1px 0;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr > td {
- text-align: left;
- border: 1px solid #E0E2E5;
- border-width: 0 0 1px 0;
- padding: 1rem 1rem;
-}
-:host ::ng-deep .p-datatable .p-paginator-bottom{
- height: 40px;
- background: transparent;
- border: none;
- margin-top:10px;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr{
- background: transparent;
-}
-:host ::ng-deep .p-datatable>.p-datatable-wrapper {
- overflow: visible;
-}
+
diff --git a/src/app/appmarket/appmanagement/app-management-list/appmanagementlist.component.html b/src/app/appmarket/appmanagement/app-management-list/appmanagementlist.component.html
index 1659e65fd75554b06494ad9e87d2cdf9404edac7..8c62d32324d1e5e25b5cf52127828ae5af7c8353 100644
--- a/src/app/appmarket/appmanagement/app-management-list/appmanagementlist.component.html
+++ b/src/app/appmarket/appmanagement/app-management-list/appmanagementlist.component.html
@@ -19,10 +19,21 @@
<ng-template pTemplate="header">
<tr>
<th></th>
- <th>{{'APPS_MANAGEMENT.NAME' | translate}}</th>
- <th>{{'APPS_MANAGEMENT.OWNER' | translate}}</th>
- <th *ngIf="isAnySubtableVisible()">{{'APPS_MANAGEMENT.VERSION' | translate}}</th>
- <th *ngIf="isAnySubtableVisible()">{{'APPS_MANAGEMENT.STATE' | translate}}</th>
+ <th pSortableColumn="name">
+ {{'APPS_MANAGEMENT.NAME' | translate}}
+ <p-sortIcon field="name"></p-sortIcon>
+ </th>
+ <th pSortableColumn="owner">
+ {{'APPS_MANAGEMENT.OWNER' | translate}}
+ <p-sortIcon field="owner"></p-sortIcon>
+ </th>
+ <th *ngIf="isAnySubtableVisible()">
+ {{'APPS_MANAGEMENT.VERSION' | translate}}
+
+ </th>
+ <th *ngIf="isAnySubtableVisible()">
+ {{'APPS_MANAGEMENT.STATE' | translate}}
+ </th>
<th></th>
<th></th>
<th></th>
diff --git a/src/app/appmarket/bulkDeployment/bulk-list/bulk-list.component.css b/src/app/appmarket/bulkDeployment/bulk-list/bulk-list.component.css
index 4cf5f82b19e0be3b3cffaf9b59b5303e36e7c46b..81faf4286ba49fea43ef151ccf0535977a655763 100644
--- a/src/app/appmarket/bulkDeployment/bulk-list/bulk-list.component.css
+++ b/src/app/appmarket/bulkDeployment/bulk-list/bulk-list.component.css
@@ -8,55 +8,4 @@
margin-left: 5px;
margin-right: 5px;
}
-:host ::ng-deep .p-datatable .p-datatable-thead > tr > th{
- border: 1px solid #E0E2E5;
- background:transparent;
- border-width: 0 0 1px 0;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr > td {
- text-align: left;
- border: 1px solid #E0E2E5;
- border-width: 0 0 1px 0;
- padding: 1rem 1rem;
-}
-:host ::ng-deep .p-datatable .p-paginator-bottom{
- height: 40px;
- background: transparent;
- border: none;
- margin-top:10px;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr{
- background: transparent;
-}
-:host ::ng-deep .p-datatable>.p-datatable-wrapper {
- overflow: visible;
-}
-:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{
- transition: unset;
- border-radius: 50%;
- min-width:3.5rem;
- height:3.5rem;
- margin:0 5px;
- font-size: 14px;
-}
-:host ::ng-deep .p-paginator-element{
- border-radius:50%;
- margin:0 5px;
- min-width:3.5rem;
- height:3.5rem;
- font-size: 14px;
-}
-:host ::ng-deep .p-paginator .p-dropdown{
- height:3rem;
-}
-:host ::ng-deep .p-paginator-icon{
- height: 1.5rem;
- width: 1.5rem;
-}
-:host ::ng-deep .p-paginator .p-dropdown .p-dropdown-label{
- padding-right: 10px;
-}
-:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{
- background: var(--user-button-background-hover);
-}
diff --git a/src/app/appmarket/bulkDeployment/bulk-list/bulk-list.component.html b/src/app/appmarket/bulkDeployment/bulk-list/bulk-list.component.html
index a5a8ef712c04e2e0127d1a1aa305b201c93abee4..29bef44c53d82bf456ebf0f4e54b20f0ffcc145c 100644
--- a/src/app/appmarket/bulkDeployment/bulk-list/bulk-list.component.html
+++ b/src/app/appmarket/bulkDeployment/bulk-list/bulk-list.component.html
@@ -21,7 +21,7 @@
label="Deployments Queue"
severity="secondary"
></p-button>
- <p-sidebar [(visible)]="sidebarVisible4" position="left" styleClass="w-30rem">
+ <p-sidebar [(visible)]="sidebarVisible4" position="right" styleClass="w-30rem">
<h3>Deployments Queue</h3>
<div class="flex flex-column">
<div class="flex grid">
@@ -69,10 +69,18 @@
<p-table *ngIf="mode === 'DOMAIN'" [value]="bulks" class="p-datatable-hover p-datatable-sm" [responsive]="true" (onSort)="onSort($event)">
<ng-template pTemplate="header">
<tr>
- <th pSortableColumn="id">{{'BULK.LIST.ID' | translate}}</th>
- <th pSortableColumn="creator">{{'BULK.LIST.CREATOR' | translate}}</th>
- <th pSortableColumn="date">{{'BULK.LIST.CREATION_DATE' | translate}}</th>
- <th pSortableColumn="state">{{'BULK.LIST.STATE' | translate}}</th>
+ <th pSortableColumn="id">{{'BULK.LIST.ID' | translate}}
+ <p-sortIcon field="id"></p-sortIcon>
+ </th>
+ <th pSortableColumn="creator">{{'BULK.LIST.CREATOR' | translate}}
+ <p-sortIcon field="creator"></p-sortIcon>
+ </th>
+ <th pSortableColumn="date">{{'BULK.LIST.CREATION_DATE' | translate}}
+ <p-sortIcon field="date"></p-sortIcon>
+ </th>
+ <th pSortableColumn="state">{{'BULK.LIST.STATE' | translate}}
+ <p-sortIcon field="state"></p-sortIcon>
+ </th>
<th></th>
</tr>
</ng-template>
@@ -148,12 +156,24 @@
(onSort)="onSort($event)">
<ng-template pTemplate="header">
<tr>
- <th pSortableColumn="id">{{'BULK.LIST.ID' | translate}}</th>
- <th pSortableColumn="creator">{{'BULK.LIST.CREATOR' | translate}}</th>
- <th pSortableColumn="app_name">{{'BULK.LIST.APP_NAME' | translate}}</th>
- <th pSortableColumn="instance_no">{{'BULK.LIST.INSTANCE_NO' | translate}}</th>
- <th pSortableColumn="date" pSortOrder="-1">{{'BULK.LIST.CREATION_DATE' | translate}}</th>
- <th pSortableColumn="state">{{'BULK.LIST.STATE' | translate}}</th>
+ <th pSortableColumn="id">{{'BULK.LIST.ID' | translate}}
+ <p-sortIcon field="id"></p-sortIcon>
+ </th>
+ <th pSortableColumn="creator">{{'BULK.LIST.CREATOR' | translate}}
+ <p-sortIcon field="creator"></p-sortIcon>
+ </th>
+ <th pSortableColumn="app_name">{{'BULK.LIST.APP_NAME' | translate}}
+ <p-sortIcon field="app_name"></p-sortIcon>
+ </th>
+ <th pSortableColumn="instance_no">{{'BULK.LIST.INSTANCE_NO' | translate}}
+ <p-sortIcon field="instance_no"></p-sortIcon>
+ </th>
+ <th pSortableColumn="date" pSortOrder="-1">{{'BULK.LIST.CREATION_DATE' | translate}}
+ <p-sortIcon field="date"></p-sortIcon>
+ </th>
+ <th pSortableColumn="state">{{'BULK.LIST.STATE' | translate}}
+ <p-sortIcon field="state"></p-sortIcon>
+ </th>
<th></th>
</tr>
</ng-template>
diff --git a/src/app/appmarket/domains/list/domainslist.component.css b/src/app/appmarket/domains/list/domainslist.component.css
index 321cf6dcfea2a53ade3fd4e2fb74f9f6d693abc1..f53cede1f87da0dc9913a49b194585761fc63a40 100644
--- a/src/app/appmarket/domains/list/domainslist.component.css
+++ b/src/app/appmarket/domains/list/domainslist.component.css
@@ -21,64 +21,10 @@ tr.clickable {
display: flex;
justify-content: space-between;
}
-
-:host ::ng-deep .p-datatable .p-datatable-thead > tr > th{
- border: 1px solid #E0E2E5;
- background:transparent;
- border-width: 0 0 1px 0;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr > td {
- text-align: left;
- border: 1px solid #E0E2E5;
- border-width: 0 0 1px 0;
- padding: 1rem 1rem;
-}
-:host ::ng-deep .p-datatable .p-paginator-bottom{
- height: 40px;
- background: transparent;
- border: none;
- margin-top:10px;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr{
- background: transparent;
-}
-
-:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{
- transition: unset;
- border-radius: 50%;
- min-width:3.5rem;
- height:3.5rem;
- margin:0 5px;
- font-size: 14px;
-}
-
-:host ::ng-deep .p-paginator-element{
- border-radius:50%;
- margin:0 5px;
- min-width:3.5rem;
- height:3.5rem;
- font-size: 14px;
-}
-:host ::ng-deep .p-paginator .p-dropdown{
- height:3rem;
-}
-:host ::ng-deep .p-paginator-icon{
- height: 1.5rem;
- width: 1.5rem;
-}
-:host ::ng-deep .p-paginator .p-dropdown .p-dropdown-label{
- padding-right: 10px;
-}
-
label{
padding-left:5px;
display: unset;
margin-bottom: 0;
font-weight: unset;
}
-:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{
- background: var(--user-button-background-hover);
-}
-:host ::ng-deep .p-datatable>.p-datatable-wrapper {
- overflow: visible;
-}
+
diff --git a/src/app/shared/about/about.component.html b/src/app/shared/about/about.component.html
index fbfc641bef0ddc923167316b5eb540faacb61225..93662491047eb9332ea1a61af958ffacc4007969 100644
--- a/src/app/shared/about/about.component.html
+++ b/src/app/shared/about/about.component.html
@@ -1,4 +1,4 @@
-<div class="col-md-offset-1 col-md-10 col-lg-offset-1 col-lg-10 row position" style="padding-bottom: 80px; padding-top: 80px;">
+<div class=" row position" style="margin:40px">
<div class="col-md-6">
<div class="" style="padding-bottom: 15px;">
<h2>{{ 'ABOUT.CHANGELOG_TITLE' | translate }}</h2>
diff --git a/src/app/shared/admin/clusters/manager/manager.component.css b/src/app/shared/admin/clusters/manager/manager.component.css
index e8f718b9b23f9947c3bdaa5101af7216e5972611..04f59b4cda004ddaf1de69eb8a2ee9368922f090 100644
--- a/src/app/shared/admin/clusters/manager/manager.component.css
+++ b/src/app/shared/admin/clusters/manager/manager.component.css
@@ -1,92 +1,6 @@
-:host ::ng-deep .p-datatable .p-datatable-thead > tr > th{
- border: 1px solid #E0E2E5;
- background:transparent;
- border-width: 0 0 1px 0;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr > td {
- text-align: left;
- border: 1px solid #E0E2E5;
- border-width: 0 0 1px 0;
- padding: 1rem 1rem;
-}
-:host ::ng-deep .p-datatable .p-paginator-bottom{
- height: 40px;
- background: transparent;
- border: none;
- margin-top:10px;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr{
- background: transparent;
-}
-
-:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{
- transition: unset;
- border-radius: 50%;
- min-width:3.5rem;
- height:3.5rem;
- margin:0 5px;
- font-size: 14px;
-}
-
-:host ::ng-deep .p-paginator-element{
- border-radius:50%;
- margin:0 5px;
- min-width:3.5rem;
- height:3.5rem;
- font-size: 14px;
-}
-:host ::ng-deep .p-paginator .p-dropdown{
- height:3rem;
-}
-:host ::ng-deep .p-paginator-icon{
- height: 1.5rem;
- width: 1.5rem;
-}
-:host ::ng-deep .p-paginator .p-dropdown .p-dropdown-label{
- padding-right: 10px;
-}
-
label{
padding-left:5px;
display: unset;
margin-bottom: 0;
font-weight: unset;
}
-:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{
- background: var(--user-button-background-hover);
-}
-:host ::ng-deep .p-datatable>.p-datatable-wrapper {
- overflow: visible;
-}
-
-:host ::ng-deep input[type=file]{
- display:none;
-}
-:host ::ng-deep .p-button{
- width: unset;
- margin-right: 5px;
- background: var(--primary-button-color);
- color: var(--button-text-color);
-}
-:host ::ng-deep .p-button:hover{
- background: var(--primary-button-hover);
- border:none;
-}
-:host ::ng-deep .p-button-label{
- font-weight: normal;
-}
-:host ::ng-deep .p-fileupload .p-fileupload-buttonbar{
- border: none;
- background: transparent;
- margin-bottom: 10px;
- padding: 0;
-}
-:host ::ng-deep .p-fileupload .p-fileupload-content{
- border: none;
- padding: 0;
- border-radius: 3px;
-
-}
-:host ::ng-deep .p-fileupload-content .p-progressbar{
- display: none;
-}
diff --git a/src/app/shared/admin/clusters/manager/manager.component.html b/src/app/shared/admin/clusters/manager/manager.component.html
index 2df54c894c97b3b34065b1bb6ff7ce4d41f7aeac..c2bd190e2c5c187b779b6dd57c5fc8403fa42d78 100644
--- a/src/app/shared/admin/clusters/manager/manager.component.html
+++ b/src/app/shared/admin/clusters/manager/manager.component.html
@@ -12,18 +12,29 @@
<h4 class="header">{{ 'CLUSTERS.CONFIGURATION' | translate }}</h4>
<div class="background-section">
- <p-table [value]="clusters" [paginator]="true"
+ <p-table
+ [value]="clusters"
[paginator]="true"
[rows]="maxItemsOnPage"
[rowsPerPageOptions]="[15, 20, 25, 30, 50]"
- [responsiveLayout]="'scroll'">>
+ [responsiveLayout]="'scroll'">
<ng-template pTemplate="header">
<tr>
- <th pSortableColumn="id" id="id"> {{ 'CLUSTERS.ID' | translate }}</th>
- <th pSortableColumn="name" id="name"> {{ 'CLUSTERS.NAME' | translate }}</th>
- <th pSortableColumn="codename" id="codename"> {{ 'CLUSTERS.CODENAME' | translate }}</th>
- <th pSortableColumn="creationDate" id="creationDate"> {{ 'CLUSTERS.CREATION_DATE' | translate }}</th>
- <th pSortableColumn="modificationDate" id="modificationDate"> {{ 'CLUSTERS.MODIFICATION_DATE' | translate }}</th>
+ <th pSortableColumn="id" id="id"> {{ 'CLUSTERS.ID' | translate }}
+ <p-sortIcon field="id"></p-sortIcon>
+ </th>
+ <th pSortableColumn="name" id="name"> {{ 'CLUSTERS.NAME' | translate }}
+ <p-sortIcon field="name"></p-sortIcon>
+ </th>
+ <th pSortableColumn="codename" id="codename"> {{ 'CLUSTERS.CODENAME' | translate }}
+ <p-sortIcon field="codename"></p-sortIcon>
+ </th>
+ <th pSortableColumn="creationDate" id="creationDate"> {{ 'CLUSTERS.CREATION_DATE' | translate }}
+ <p-sortIcon field="creationDate"></p-sortIcon>
+ </th>
+ <th pSortableColumn="modificationDate" id="modificationDate"> {{ 'CLUSTERS.MODIFICATION_DATE' | translate }}
+ <p-sortIcon field="modificationDate"></p-sortIcon>
+ </th>
<th></th>
</tr>
</ng-template>
diff --git a/src/app/shared/footer/footer.component.html b/src/app/shared/footer/footer.component.html
index ed9b650118ec98d17e0832b81cc15988dbe4488e..e39c025be237c2abd69a09b6811a31051f220a54 100644
--- a/src/app/shared/footer/footer.component.html
+++ b/src/app/shared/footer/footer.component.html
@@ -9,7 +9,7 @@
</a>
</div>
<div class="">
- <img alt="EU flag" src="/assets/images/cofunded.png" width="100" style="padding-top: 15px; "/>
+ <img alt="EU flag" src="/assets/images/cofunded.png" width="180" style="padding-top: 5px; "/>
</div>
</div>
<div class="" style="display: flex; width: 50%; justify-content: end; margin-right: 50px">
diff --git a/src/app/shared/left-menu/left-menu.component.css b/src/app/shared/left-menu/left-menu.component.css
index 0d858374a455923f5cba11191cd16aff7aaefb5b..4ae8e6cfc231bdce82773cef601b773e09fe7be0 100644
--- a/src/app/shared/left-menu/left-menu.component.css
+++ b/src/app/shared/left-menu/left-menu.component.css
@@ -81,6 +81,7 @@
}
:host ::ng-deep a:focus{
outline: none;
+ text-decoration: none;
}
:host ::ng-deep .p-accordion .p-accordion-content{
background: transparent;
diff --git a/src/app/shared/left-menu/left-menu.component.html b/src/app/shared/left-menu/left-menu.component.html
index 43e3055bb8adf414201ae2ebdb97d11241df8ec1..38d7687035637e3d3ee3cc8913e63affe9d93231 100644
--- a/src/app/shared/left-menu/left-menu.component.html
+++ b/src/app/shared/left-menu/left-menu.component.html
@@ -15,7 +15,7 @@
<ul *ngIf="!toggleAdmin" style="margin-top: 30px" >
<li [routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a style="display: flex; align-items: center;" [routerLink]="['/']">
- <i class="pi pi-th-large" style="margin-right:10px; font-size: 15px" title="Application"></i>
+ <i class="pi pi-th-large" style="margin-right:10px; font-size: 18px" title="Application"></i>
<span *ngIf="!isCollapsed">
Applications
</span>
@@ -23,7 +23,7 @@
</li>
<li [routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a href="#" style="display: flex; align-items: center;" [routerLink]="['/instances']">
- <i class="pi pi-server" style="margin-right:10px; font-size: 15px" title=" Instances"></i>
+ <i class="pi pi-server" style="margin-right:10px; font-size: 18px" title=" Instances"></i>
<span *ngIf="!isCollapsed">
Instances
</span>
@@ -33,7 +33,7 @@
<ul *ngIf="toggleAdmin" style="margin-top: 30px">
<li [routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a style="display: flex; align-items: center;" [routerLink]="['admin/dashboard']">
- <i class="pi pi-chart-bar" style="margin-right:10px; font-size: 15px" title="Dashboard"></i>
+ <i class="pi pi-chart-bar" style="margin-right:10px; font-size: 18px" title="Dashboard"></i>
<span *ngIf="!isCollapsed">
Dashboard
</span>
@@ -43,7 +43,7 @@
<p-accordionTab *roles="['ROLE_DOMAIN_ADMIN', 'ROLE_SYSTEM_ADMIN', 'ROLE_OPERATOR', 'ROLE_GROUP_MANAGER', 'ROLE_GROUP_DOMAIN_ADMIN']">
<ng-template pTemplate="header">
<div>
- <i class="pi pi-server" style="margin-right:10px; font-size: 15px" title="{{ 'NAVBAR.DOMAINS' | translate }}"></i>
+ <i class="pi pi-server" style="margin-right:10px; font-size: 18px" title="{{ 'NAVBAR.DOMAINS' | translate }}"></i>
<span *ngIf="!isCollapsed">
{{ 'NAVBAR.DOMAINS' | translate }}
</span>
@@ -52,7 +52,7 @@
<li *roles="['ROLE_DOMAIN_ADMIN', 'ROLE_SYSTEM_ADMIN', 'ROLE_OPERATOR', 'ROLE_GROUP_MANAGER', 'ROLE_GROUP_DOMAIN_ADMIN']"
[routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}" >
<a style="display: flex; align-items: center;" [routerLink]="['/admin/domains']">
- <i class="pi pi-list" style="margin-right:10px; font-size: 15px" title="List"></i>
+ <i class="pi pi-list" style="margin-right:10px; font-size: 18px" title="List"></i>
<span *ngIf="!isCollapsed">
List
</span>
@@ -61,7 +61,7 @@
<li *roles="['ROLE_SYSTEM_ADMIN', 'ROLE_GROUP_MANAGER']"
[routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a style="display: flex; align-items: center;" [routerLink]="['/admin/domains/groups']">
- <i class="pi pi-table" style="margin-right:10px; font-size: 15px" title="Group"></i>
+ <i class="pi pi-table" style="margin-right:10px; font-size: 18px" title="Group"></i>
<span *ngIf="!isCollapsed">
Group
</span>
@@ -70,7 +70,7 @@
<li *roles="['ROLE_SYSTEM_ADMIN', 'ROLE_GROUP_MANAGER']"
[routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a style="display: flex; align-items: center;" [routerLink]="['/admin/domains/bulks']">
- <i class="pi pi-sitemap" style="margin-right:10px; font-size: 15px" title="Bulk deployments"></i>
+ <i class="pi pi-sitemap" style="margin-right:10px; font-size: 18px" title="Bulk deployments"></i>
<span *ngIf="!isCollapsed">
Bulk deployments
</span>
@@ -80,7 +80,7 @@
</p-accordion>
<li *roles="['ROLE_SYSTEM_ADMIN', 'ROLE_GROUP_MANAGER']" [routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a style="display: flex; align-items: center;" [routerLink]="['/admin/apps/bulks']">
- <i class="pi pi-box" style="margin-right:10px; font-size: 15px" title="{{ 'BULK.APP.HEADER' | translate }}"></i>
+ <i class="pi pi-box" style="margin-right:10px; font-size: 18px" title="{{ 'BULK.APP.HEADER' | translate }}"></i>
<span *ngIf="!isCollapsed">
{{ 'BULK.APP.HEADER' | translate }}
</span>
@@ -88,7 +88,7 @@
</li>
<li *roles="['ROLE_SYSTEM_ADMIN']" [routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a style="display: flex; align-items: center;" [routerLink]="['/admin/users']">
- <i class="pi pi-users" style="margin-right:10px; font-size: 15px" title="{{ 'NAVBAR.USERS' | translate }}"></i>
+ <i class="pi pi-users" style="margin-right:10px; font-size: 18px" title="{{ 'NAVBAR.USERS' | translate }}"></i>
<span *ngIf="!isCollapsed">
{{ 'NAVBAR.USERS' | translate }}
</span>
@@ -96,7 +96,7 @@
</li>
<li *roles="['ROLE_DOMAIN_ADMIN', 'ROLE_GROUP_DOMAIN_ADMIN']" [routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a style="display: flex; align-items: center;" [routerLink]="['/admin/domain/users']">
- <i class="pi pi-users" style="margin-right:10px; font-size: 15px" title="{{ 'NAVBAR.DOMAIN_USERS' | translate }}"></i>
+ <i class="pi pi-users" style="margin-right:10px; font-size: 18px" title="{{ 'NAVBAR.DOMAIN_USERS' | translate }}"></i>
<span *ngIf="!isCollapsed">
{{ 'NAVBAR.DOMAIN_USERS' | translate }}
</span>
@@ -104,7 +104,7 @@
</li>
<li *roles="['ROLE_SYSTEM_ADMIN', 'ROLE_TOOL_MANAGER']" [routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a style="display: flex; align-items: center;" [routerLink]="['/admin/apps']">
- <i class="pi pi-th-large" style="margin-right:10px; font-size: 15px" title="Catalog"></i>
+ <i class="pi pi-th-large" style="margin-right:10px; font-size: 18px" title="Catalog"></i>
<span *ngIf="!isCollapsed">
Catalog
</span>
@@ -112,7 +112,7 @@
</li>
<li *roles="['ROLE_SYSTEM_ADMIN']" [routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a style="display: flex; align-items: center;" [routerLink]="['/admin/configuration']">
- <i class="pi pi-cog" style="margin-right:10px; font-size: 15px" title="Settings"></i>
+ <i class="pi pi-cog" style="margin-right:10px; font-size: 18px" title="Settings"></i>
<span *ngIf="!isCollapsed">
Settings
</span>
@@ -120,7 +120,7 @@
</li>
<li *roles="['ROLE_SYSTEM_ADMIN']" [routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a style="display: flex; align-items: center;" [routerLink]="['/admin/manage/clusters']">
- <i class="pi pi-cog" style="margin-right:10px; font-size: 15px"></i>
+ <i class="pi pi-cog" style="margin-right:10px; font-size: 18px"></i>
<span *ngIf="!isCollapsed">
{{ 'CLUSTERS.CONFIGURATION' | translate }}
</span>
@@ -128,7 +128,7 @@
</li>
<li *roles="['ROLE_SYSTEM_ADMIN']" [routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a style="display: flex; align-items: center;" [routerLink]="['/admin/languages']">
- <i class="pi pi-tags" style="margin-right:10px; font-size: 15px" title=" {{'NAVBAR.LANGUAGES' | translate }}"></i>
+ <i class="pi pi-tags" style="margin-right:10px; font-size: 18px" title=" {{'NAVBAR.LANGUAGES' | translate }}"></i>
<span *ngIf="!isCollapsed">
{{'NAVBAR.LANGUAGES' | translate }}
</span>
@@ -136,14 +136,14 @@
</li>
<li *roles="['ROLE_SYSTEM_ADMIN', 'ROLE_OPERATOR']" [routerLinkActiveOptions]="{exact:true}" [routerLinkActive]="['active']" [ngClass]="{'collapsed': isCollapsed}">
<a style="display: flex; align-items: center;" [routerLink]="['/admin/monitor']">
- <i class="pi pi-chart-line" style="margin-right:10px; font-size: 15px" title="{{ 'NAVBAR.MONITOR' | translate }}"></i>
+ <i class="pi pi-chart-line" style="margin-right:10px; font-size: 18px" title="{{ 'NAVBAR.MONITOR' | translate }}"></i>
<span *ngIf="!isCollapsed">
{{ 'NAVBAR.MONITOR' | translate }}
</span>
</a>
</li>
<li *roles="['ROLE_SYSTEM_ADMIN']" (click)="showNotificationModal()" [ngClass]="{'collapsed': isCollapsed}">
- <i class="pi pi-send" style="margin-right:10px; font-size: 15px" title="{{ 'NAVBAR.ALL_USERS' | translate }}"></i>
+ <i class="pi pi-send" style="margin-right:10px; font-size: 18px" title="{{ 'NAVBAR.ALL_USERS' | translate }}"></i>
<span *ngIf="!isCollapsed">{{ 'NAVBAR.ALL_USERS' | translate }}</span>
</li>
@@ -151,22 +151,22 @@
</div>
<div class="menu flex">
<p-menu #menu [model]="items" [popup]="true" class="test" [ngClass]="{'collapsed-user': isCollapsed}"/>
- <p-button (onClick)="menu.toggle($event)" class="user-button"><i class="pi pi-user" style="font-size: 13px; margin-right:10px"[ngClass]="{'collapsed': isCollapsed}" title="User"></i>
+ <p-button (onClick)="menu.toggle($event)" class="user-button"><i class="pi pi-user" style="font-size: 18px; margin-right:10px"[ngClass]="{'collapsed': isCollapsed}" title="User"></i>
<span *ngIf="!isCollapsed">
- User
+ User
</span>
</p-button>
<div style="margin-top:10px" [routerLink]="['admin/dashboard']">
- <p-button *ngIf="!toggleAdmin" (onClick)="adminPanel()" ><i class="pi pi-sign-in" style="margin-right:10px; font-size: 15px"[ngClass]="{'collapsed': isCollapsed}" title=" Go to admin panel"></i>
+ <p-button *ngIf="!toggleAdmin" (onClick)="adminPanel()" ><i class="pi pi-sign-in" style="margin-right:10px; font-size: 18px"[ngClass]="{'collapsed': isCollapsed}" title=" Go to admin panel"></i>
<span *ngIf="!isCollapsed">
- Go to admin panel
+ Admin panel
</span>
</p-button>
</div>
<div [routerLink]="['/']" >
- <p-button *ngIf="toggleAdmin" (onClick)="adminPanel()" ><i class="pi pi-sign-in" style="margin-right:10px; font-size: 15px"[ngClass]="{'collapsed': isCollapsed}" title="Go to user panel"></i>
+ <p-button *ngIf="toggleAdmin" (onClick)="adminPanel()" ><i class="pi pi-sign-in" style="margin-right:10px; font-size: 18px"[ngClass]="{'collapsed': isCollapsed}" title="Go to user panel"></i>
<span *ngIf="!isCollapsed">
- Go to user panel
+ User panel
</span>
</p-button>
</div>
diff --git a/src/app/shared/users/list/userslist.component.css b/src/app/shared/users/list/userslist.component.css
index ded3a5ff710dfbf80e9c7d86fbcaa91cefc32731..018a8b04f96d66b5a17cad0ef9d105004dc2ad50 100644
--- a/src/app/shared/users/list/userslist.component.css
+++ b/src/app/shared/users/list/userslist.component.css
@@ -32,56 +32,4 @@ li::marker {
content: '';
font-size: 0em;
}
-:host ::ng-deep .p-datatable .p-datatable-thead > tr > th{
- border: 1px solid #E0E2E5;
- background:transparent;
- border-width: 0 0 1px 0;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr > td {
- text-align: left;
- border: 1px solid #E0E2E5;
- border-width: 0 0 1px 0;
- padding: 1rem 1rem;
-}
-:host ::ng-deep .p-datatable .p-paginator-bottom{
- height: 40px;
- background: transparent;
- border: none;
- margin-top:10px;
-}
-:host ::ng-deep .p-datatable .p-datatable-tbody > tr{
- background: transparent;
-}
-
-:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{
- transition: unset;
- border-radius: 50%;
- min-width:3.5rem;
- height:3.5rem;
- margin:0 5px;
- font-size: 14px;
-}
-:host ::ng-deep .p-paginator-element{
- border-radius:50%;
- margin:0 5px;
- min-width:3.5rem;
- height:3.5rem;
- font-size: 14px;
-}
-:host ::ng-deep .p-paginator .p-dropdown{
- height:3rem;
-}
-:host ::ng-deep .p-paginator-icon{
- height: 1.5rem;
- width: 1.5rem;
-}
-:host ::ng-deep .p-paginator .p-dropdown .p-dropdown-label{
- padding-right: 10px;
-}
-:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{
- background: var(--user-button-background-hover);
-}
-:host ::ng-deep .p-datatable>.p-datatable-wrapper {
- overflow: visible;
-}
diff --git a/src/app/shared/users/list/userslist.component.html b/src/app/shared/users/list/userslist.component.html
index 669dc950d1e3a5318906bc23c8f64c019f3c62b3..39d46e17d1dd501a7dc60d261a9cf9338ce8aa36 100644
--- a/src/app/shared/users/list/userslist.component.html
+++ b/src/app/shared/users/list/userslist.component.html
@@ -71,22 +71,42 @@
[rowsPerPageOptions]="[15, 20, 25, 30, 50]" >
<ng-template pTemplate="header">
<tr>
- <th scope="col" class="column-sortable" sortable-column="username"
- sort-direction="asc">{{ 'USERS.USER_NAME' | translate }}</th>
- <th scope="col" class="column-sortable" sortable-column="lastname">{{'USERS.NAME' | translate}}</th>
- <th *ngIf="!domainMode" scope="col" class="column-sortable"
- sortable-column="email">{{'USERS.EMAIL' | translate}}</th>
- <th scope="col" class="column-sortable" sortable-column="domains"
- *ngIf="domainId === domainService.getGlobalDomainId()">{{ 'USERS.DOMAINS' | translate }}</th>
- <th scope="col" class="column-sortable" sortable-column="globalRole"
- *ngIf="domainId === domainService.getGlobalDomainId()">{{ 'USERS.GLOBAL_ROLE' | translate }}</th>
- <th scope="col" class="column-sortable" sortable-column="roles"
- *ngIf="domainId !== domainService.getGlobalDomainId() && !isModeAllowed(ComponentMode.EDIT)">{{ 'USERS.ROLES' | translate }}</th>
- <th scope="col" class="column-sortable" *ngIf="!isModeAllowed(ComponentMode.EDIT) && !domainMode"
- sortable-column="firstLoginDate">{{ 'USERS.FIRST_LOGIN' | translate }}</th>
- <th scope="col" class="column-sortable" *ngIf="!isModeAllowed(ComponentMode.EDIT) && !domainMode"
- sortable-column="lastSuccessfulLoginDate">{{ 'USERS.LAST_SUCCESSFUL_LOGIN' | translate }}</th>
- <th scope="col" class="column-sortable" sortable-column="enabled">{{ 'USERS.ENABLED' | translate }}</th>
+ <th scope="col" class="column-sortable" pSortableColumn="username">
+ {{ 'USERS.USER_NAME' | translate }}
+ <p-sortIcon field="username"></p-sortIcon>
+ </th>
+ <th scope="col" class="column-sortable" pSortableColumn="lastname">
+ {{'USERS.NAME' | translate}}
+ <p-sortIcon field="lastname"></p-sortIcon>
+ </th>
+ <th *ngIf="!domainMode" scope="col" class="column-sortable" pSortableColumn="email">
+ {{'USERS.EMAIL' | translate}}
+ <p-sortIcon field="email"></p-sortIcon>
+ </th>
+ <th scope="col" class="column-sortable" pSortableColumn="domains" *ngIf="domainId === domainService.getGlobalDomainId()">
+ {{ 'USERS.DOMAINS' | translate }}
+ <p-sortIcon field="domains"></p-sortIcon>
+ </th>
+ <th scope="col" class="column-sortable" pSortableColumn="globalRole" *ngIf="domainId === domainService.getGlobalDomainId()">
+ {{ 'USERS.GLOBAL_ROLE' | translate }}
+ <p-sortIcon field="globalRole"></p-sortIcon>
+ </th>
+ <th scope="col" class="column-sortable" pSortableColumn="roles" *ngIf="domainId !== domainService.getGlobalDomainId() && !isModeAllowed(ComponentMode.EDIT)">
+ {{ 'USERS.ROLES' | translate }}
+ <p-sortIcon field="roles"></p-sortIcon>
+ </th>
+ <th scope="col" class="column-sortable" *ngIf="!isModeAllowed(ComponentMode.EDIT) && !domainMode" pSortableColumn="firstLoginDate">
+ {{ 'USERS.FIRST_LOGIN' | translate }}
+ <p-sortIcon field="firstLoginDate"></p-sortIcon>
+ </th>
+ <th scope="col" class="column-sortable" *ngIf="!isModeAllowed(ComponentMode.EDIT) && !domainMode" pSortableColumn="lastSuccessfulLoginDate">
+ {{ 'USERS.LAST_SUCCESSFUL_LOGIN' | translate }}
+ <p-sortIcon field="lastSuccessfulLoginDate"></p-sortIcon>
+ </th>
+ <th scope="col" class="column-sortable" pSortableColumn="enabled">
+ {{ 'USERS.ENABLED' | translate }}
+ <p-sortIcon field="enabled"></p-sortIcon>
+ </th>
<th *ngIf="!isModeAllowed(ComponentMode.EDIT)" scope="col"> </th>
<th *ngIf="isModeAllowed(ComponentMode.EDIT)" scope="col"> </th>
</tr>
diff --git a/src/styles.css b/src/styles.css
index 412d7d47804d5dcfcf5dc60c985f0e9036b96acf..b467c8f239634fbb7639cfd5035144c2ca746c71 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -178,3 +178,65 @@
.text-bold {
font-weight: 700;;
}
+
+
+body .p-datatable .p-datatable-thead > tr > th{
+ border: 1px solid #E0E2E5;
+ background:transparent;
+ border-width: 0 0 1px 0;
+}
+body .p-datatable .p-datatable-tbody > tr > td {
+ text-align: left;
+ border: 1px solid #E0E2E5;
+ border-width: 0 0 1px 0;
+ padding: 1rem 1rem;
+}
+body .p-datatable .p-paginator-bottom{
+ height: 40px;
+ background: transparent;
+ border: none;
+ margin-top:10px;
+}
+body .p-datatable .p-datatable-tbody > tr{
+ background: transparent;
+}
+
+body .p-paginator .p-paginator-pages .p-paginator-page{
+ transition: unset;
+ border-radius: 50%;
+ min-width:3.5rem;
+ height:3.5rem;
+ margin:0 5px;
+ font-size: 14px;
+}
+
+body .p-paginator-element{
+ border-radius:50%;
+ margin:0 5px;
+ min-width:3.5rem;
+ height:3.5rem;
+ font-size: 14px;
+}
+body .p-paginator .p-dropdown{
+ height:3rem;
+}
+body .p-paginator-icon{
+ height: 1.5rem;
+ width: 1.5rem;
+}
+body .p-paginator .p-dropdown .p-dropdown-label{
+ padding-right: 10px;
+}
+
+body .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{
+ background: var(--user-button-background-hover);
+}
+body .p-datatable>.p-datatable-wrapper {
+ overflow: visible;
+}
+body .p-datatable .p-sortable-column.p-highlight{
+ color: var(--primary-button-color);
+}
+body .p-datatable .p-sortable-column.p-highlight .p-sortable-column-icon{
+ color:var(--primary-button-color);
+}