#955 Horizontal scrollbar for dynamic table

This commit is contained in:
Denys Vuika
2016-11-02 11:48:23 +00:00
parent e5dc17ab2c
commit bc3028d789
2 changed files with 27 additions and 20 deletions

View File

@@ -8,6 +8,11 @@
} }
.dynamic-table-widget__table { .dynamic-table-widget__table {
overflow-y: auto;
width: 100%;
}
.dynamic-table-widget__table > table {
width: 100%; width: 100%;
} }

View File

@@ -2,26 +2,28 @@
<div>{{content.name}}</div> <div>{{content.name}}</div>
<div *ngIf="!editMode"> <div *ngIf="!editMode">
<table class="mdl-data-table mdl-js-data-table dynamic-table-widget__table"> <div class="dynamic-table-widget__table">
<thead> <table class="mdl-data-table mdl-js-data-table">
<tr> <thead>
<th *ngFor="let column of content.visibleColumns" <tr>
class="mdl-data-table__cell--non-numeric"> <th *ngFor="let column of content.visibleColumns"
{{column.name}} class="mdl-data-table__cell--non-numeric">
</th> {{column.name}}
</tr> </th>
</thead> </tr>
<tbody> </thead>
<tr *ngFor="let row of content.rows" <tbody>
[class.dynamic-table-widget__row-selected]="row.selected"> <tr *ngFor="let row of content.rows"
<td *ngFor="let column of content.visibleColumns" [class.dynamic-table-widget__row-selected]="row.selected">
class="mdl-data-table__cell--non-numeric" <td *ngFor="let column of content.visibleColumns"
(click)="onRowClicked(row)"> class="mdl-data-table__cell--non-numeric"
{{ getCellValue(row, column) }} (click)="onRowClicked(row)">
</td> {{ getCellValue(row, column) }}
</tr> </td>
</tbody> </tr>
</table> </tbody>
</table>
</div>
<div> <div>
<button class="mdl-button mdl-js-button mdl-button--icon" <button class="mdl-button mdl-js-button mdl-button--icon"