[ADF-2930] general purpose "Empty Page" component (#3296)

* empty content component

* fix selector name

* style fixes

* cleanup code

* docs for empty content

* update docs

* update docs

* use typography for icon

* layout fixes for Login (ported from ACA)
This commit is contained in:
Denys Vuika
2018-05-10 16:13:53 +01:00
committed by GitHub
parent 18ebf9f2f7
commit 6e5d6ea3bb
16 changed files with 199 additions and 54 deletions

View File

@@ -1,7 +1,8 @@
<div
*ngIf="data" class="full-width"
[class.adf-data-table-card]="display === 'gallery'"
[class.adf-data-table]="display === 'list'">
[class.adf-data-table]="display === 'list'"
[class.adf-data-table--empty]="isEmpty()">
<div *ngIf="isHeaderVisible()" class="adf-datatable-header">
<div class="adf-datatable-row" *ngIf="display === 'list'">
<!-- Actions (left) -->

View File

@@ -14,14 +14,9 @@
$data-table-selection-color: mat-color($background, 'selected-button') !default;
$data-table-dividers: 1px solid $data-table-divider-color !default;
$data-table-row-height: 56px !default;
// $data-table-last-row-height: 56px !default;
// $data-table-header-height: 56px !default;
$data-table-column-spacing: 36px !default;
$data-table-column-padding: $data-table-column-spacing / 2;
// $data-table-card-header-height: 64px !default;
// $data-table-card-title-top: 20px !default;
$data-table-card-padding: 24px !default;
// $data-table-button-padding-right: 16px !default;
$data-table-cell-top: $data-table-card-padding / 2;
$data-table-drag-border: 1px dashed rgb(68, 138, 255);
@@ -472,4 +467,21 @@
}
}
}
.adf-data-table--empty {
@include flex-column;
justify-content: center;
align-items: center;
.adf-datatable-body {
.adf-datatable-row {
background-color: mat-color($background, card);
&:hover, &:focus {
background-color: unset;
cursor: default;
}
}
}
}
}