users view

src/app/appmarket/domains/list/domainslist.component.css

@@ -69,21 +69,7 @@ tr.clickable {
 :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);
-}
-:host ::ng-deep .p-selectbutton .p-button{
-    background: #fff;
-}
-:host ::ng-deep .p-button .p-button-label{
-    font-weight: normal;
-}
-:host ::ng-deep .p-selectbutton .p-button:not(.p-disabled):not(.p-highlight):hover{
-    background: var(--primary-button-color);
-    border-color: var(--primary-button-color);
-    color: var(--background);
-}
+
 label{
     padding-left:5px;
     display: unset;

src/app/shared/shared.module.ts

@@ -61,6 +61,7 @@ import {InputTextModule} from 'primeng/inputtext';
 import { DomainNamespaceAnnotationsComponent } from './domain-namespace-annotations/domain-namespace-annotations.component';
 import { provideZxvbnServiceForPSM  } from 'angular-password-strength-meter/zxcvbn';
 import { LeftMenuComponent } from './left-menu/left-menu.component';
+import {TableModule} from 'primeng/table';
 
 
 @NgModule({
@@ -80,6 +81,7 @@ import { LeftMenuComponent } from './left-menu/left-menu.component';
         DropdownModule,
         InputTextModule,
         FormioModule,
+        TableModule,
     ],
     declarations: [
         RateComponent,

src/app/shared/users/list/userslist.component.css

@@ -23,10 +23,6 @@ tr.clickable {
     align-items: center;
 }
 
-:host ::ng-deep .p-dropdown {
-    width: 170px;
-}
-
 .space-between {
     display: flex;
     justify-content: space-between;
@@ -36,3 +32,50 @@ 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;
+}

src/app/shared/users/list/userslist.component.spec.ts

@@ -11,6 +11,7 @@ import {NgxPaginationModule} from 'ngx-pagination';
 import {RouterTestingModule} from '@angular/router/testing';
 import {of} from 'rxjs';
 import createSpyObj = jasmine.createSpyObj;
+import { CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA } from '@angular/core';
 
 describe('UserslistComponent', () => {
     let component: UsersListComponent;
@@ -57,7 +58,8 @@ describe('UserslistComponent', () => {
                     }
                 },
                 {provide: UserService, useValue: {}},
-            ]
+            ],
+            schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA],
         })
             .compileComponents();
     }));