UI search page small improvements

smp-angular/src/app/common/row-limiter/row-limiter.component.css

+.search-table-row-limiter {
+  width: 200px;
+}
+
+.row-limiter-item {
+  min-height: 2em !important;
+}

smp-angular/src/app/common/row-limiter/row-limiter.component.html

-<div>
+<div class="search-table-row-limiter">
+
   <mat-select placeholder="Rows" [(ngModel)]="pageSize" name="pageSize" (selectionChange)="changePageSize($event)"
              id="pagesize_id">
-    <mat-option *ngFor="let rowLimit of pageSizes" [value]="rowLimit.value">
+    <mat-option class="row-limiter-item" *ngFor="let rowLimit of pageSizes" [value]="rowLimit.value">
       {{rowLimit.key}}
     </mat-option>
   </mat-select>

smp-angular/src/app/common/row-limiter/row-limiter.component.ts

@@ -2,7 +2,8 @@ import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
 
 @Component({
   selector: 'app-row-limiter',
-  templateUrl: './row-limiter.component.html'
+  templateUrl: './row-limiter.component.html',
+  styleUrls: ['./row-limiter.component.css']
 })
 export class RowLimiterComponent implements OnInit {
 

smp-angular/src/app/common/search-table/_search-table.component-theme.scss

@@ -34,3 +34,36 @@
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.24);
 }
 
+.datatable-pager li.disabled a {
+  color: rgba(0, 0, 0, 0.26) !important;
+  background-color: transparent !important;
+}
+
+.datatable-pager .pager li a {
+  margin: 0 5px;
+}
+
+.datatable-icon-right:before {
+  content: '\e5cc';
+  font-family: 'Material Icons';
+  font-style: normal;
+}
+
+.datatable-icon-left:before {
+  content: '\e5cb';
+  font-family: 'Material Icons';
+  font-style: normal;
+}
+
+.datatable-icon-prev::before {
+  content: '\e5dc';
+  font-family: 'Material Icons';
+  font-style: normal;
+}
+
+
+.datatable-icon-skip::before {
+  content: '\e5dd';
+  font-family: 'Material Icons';
+  font-style: normal;
+}

smp-angular/src/app/common/search-table/search-table.component.css

@@ -52,4 +52,3 @@
   margin-bottom: 0 !important;
 }
 
-

smp-angular/src/app/service-group-search/service-group-search.component.css

@@ -13,17 +13,17 @@
 }
 
 
-.datatable-body{
+.datatable-body {
   overflow-y: scroll;
 }
 
 ::ng-deep .inner-table {
-  margin-left: 100px;
+  margin-left: 50px;
   width: 80%;
 }
 
 ::ng-deep .inner-table .datatable-body-cell {
-  padding:  1.5em 2px !important;
+  padding:  0.2em !important;
 
 }
 

smp-angular/src/app/service-group-search/service-group-search.component.html

@@ -20,23 +20,16 @@
   <ng-template #searchPanel>
     <div style="display: flex;flex-direction: row;width: 100%">
     <mat-form-field class="smp-data-panel-field">
-      <mat-label>Resource Identifier filter</mat-label>
+      <mat-label>Resource Identifier</mat-label>
       <input matInput name="ResourceIdentifier"
              [(ngModel)]="filter.participantIdentifier"
              #messageId="ngModel" id="ResourceIdentifier">
     </mat-form-field>
     <mat-form-field  class="smp-data-panel-field">
-      <mat-label>Resource scheme filter</mat-label>
+      <mat-label>Resource scheme</mat-label>
       <input matInput  name="ResourceScheme" [(ngModel)]="filter.participantScheme"
              #messageId="ngModel" id="ResourceScheme">
     </mat-form-field>
-    <mat-select placeholder="All Domains" [(ngModel)]="filter.domain" name="domain" *ngIf="false"
-                id="domain_id">
-      <mat-option [value]="''">All Domains</mat-option>
-      <mat-option *ngFor="let domain of lookups.cachedDomainList" [value]="domain.domainCode">
-        {{domain.domainCode}} ({{domain.smlSubdomain}})
-      </mat-option>
-    </mat-select>
     </div>
   </ng-template>