inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-3119] Gallery mode layout fixed for document list (#3731)

Browse Source
This commit is contained in:
davidcanonieto
2018-09-04 11:18:49 +01:00
committed by Eugenio Romano
parent db0b9ae2e0
commit 567d172176
4 changed files with 37 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
lib/core/datatable/components/datatable/datatable.component.html
View File

@@ -49,6 +49,7 @@
<ng-container *ngIf="!loading && !noPermission">
<div *ngFor="let row of data.getRows(); let idx = index"
class="adf-datatable-row"
[class.adf-datatable-row-thumbnail]="data.thumbnails"
role="button"
[class.is-selected]="row.isSelected"
[adf-upload]="allowDropFiles && rowAllowsDrop(row)" [adf-upload-data]="row"
@@ -80,8 +81,9 @@
(change)="onCheckboxChange(row, $event)">
</mat-checkbox>
</div>
<div *ngFor="let col of data.getColumns()"
<div *ngFor="let col of data.getColumns(), let first = first;"
class="adf-data-table-cell adf-datatable-table-cell adf-data-table-cell--{{col.type || 'text'}} {{col.cssClass}}"
[class.cell-thumbnail]="data.thumbnails && first"
[attr.title]="col.title | translate"
[attr.filename]="getFilename(row)"
tabindex="0"
@@ -91,7 +93,9 @@
[context-menu-enabled]="contextMenu">
<div *ngIf="!col.template" class="cell-container">
<ng-container [ngSwitch]="col.type">
<div *ngSwitchCase="'image'" class="cell-value">
<div *ngSwitchCase="'image'"
class="cell-value"
[class.adf-image-gallery-cell]="data.thumbnails">
<mat-icon *ngIf="isIconValue(row, col); else no_iconvalue">{{ asIconValue(row, col) }}
</mat-icon>
<ng-template #no_iconvalue>
@@ -100,6 +104,7 @@
</mat-icon>
<ng-template #no_selected_row>
<img
[class.adf-image-gallery]="data.thumbnails"
alt="{{ iconAltTextKey(data.getValue(row, col)) | translate }}"
src="{{ data.getValue(row, col) }}"
(error)="onImageLoadingError($event, row)">
@@ -178,7 +183,6 @@
</button>
</mat-menu>
</div>
</div>
<div *ngIf="isEmpty()"
[class.adf-datatable-row]="display === 'list'"

23
lib/core/datatable/components/datatable/datatable.component.scss
View File

@@ -55,6 +55,10 @@
@include mat-overridable-elevation(2);
}
.adf-datatable-row-thumbnail {
height: 300px !important;
}
.adf-datatable-row-empty-card {
height: 0 !important;
padding-top: 0;
@@ -117,6 +121,7 @@
}
}
.alfresco-datatable__actions-cell {
position: absolute;
height: 42px !important;
@@ -125,6 +130,17 @@
text-align: right;
}
.adf-image-gallery {
height: 100px;
}
.adf-image-gallery-cell {
display: flex;
width: 265px;
flex: 0 0 auto;
justify-content: center;
}
.image-table-cell {
margin: 8px;
padding: 4px;
@@ -149,6 +165,13 @@
}
}
.cell-thumbnail {
flex: 0 0 auto;
display: flex;
flex-direction: column-reverse;
justify-content: space-between;
}
.adf-datatable-table-checkbox {
margin: 8px;
}