Tables¶
Tables are simply and dont need any classes. Only for a responsive design, you should wrap your table within a “.table-responsive” class, to handle small screen overflow.
Example¶
- Reference Implementation: Logging DApp
<div class="evan-content">
<h2 class="content-header m-t-0 display-inline-block">{{ 'logging' | translate }}</h2>
<ion-icon class="clickable" margin-left name="funnel" (click)="toggleFilters()"></ion-icon>
<div margin-bottom>{{ '_logging.click-to-log' | translate }}</div>
<div class="table-responsive">
<table class="table table-hover">
<thead>
<tr>
<th>{{ '_logging.timestamp' | translate }}</th>
<th>{{ '_logging.level' | translate }}</th>
<th>{{ '_logging.message' | translate }}</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let log of logs"
[ngClass]="'level-' + log.level"
(click)="logSingleLog(log)">
<td>{{ log.timestamp | date:'long':'':translateService.translate.currentLang }}</td>
<td>{{ log.level }}</td>
<td>{{ log.message }}</td>
</tr>
</tbody>
</table>
</div>
</div>
View Example¶
