mirror of
https://github.com/Myxelium/Bridge-Multi.git
synced 2026-04-11 14:19:38 +00:00
31 lines
1.4 KiB
HTML
31 lines
1.4 KiB
HTML
<table
|
|
id="resultTable"
|
|
class="ui stackable selectable single sortable fixed line striped compact small table"
|
|
[class.inverted]="settingsService.theme === 'Dark'">
|
|
<!-- TODO: maybe have some of these tags customizable? E.g. small/large/compact/padded -->
|
|
<!-- TODO: learn semantic themes in order to change the $mobileBreakpoint global variable (better search table adjustment) -->
|
|
<thead>
|
|
<!-- NOTE: it would be nice to make this header sticky, but Fomantic-UI doesn't currently support that -->
|
|
<tr>
|
|
<th class="collapsing" id="checkboxColumn">
|
|
<div class="ui checkbox" id="checkbox" #checkboxColumn appCheckbox (checked)="checkAll($event)">
|
|
<input type="checkbox" />
|
|
</div>
|
|
</th>
|
|
<th class="four wide" [class.sorted]="sortColumn === 'name'" [ngClass]="sortDirection" (click)="onColClicked('name')">Name</th>
|
|
<th class="four wide" [class.sorted]="sortColumn === 'artist'" [ngClass]="sortDirection" (click)="onColClicked('artist')">Artist</th>
|
|
<th class="four wide" [class.sorted]="sortColumn === 'album'" [ngClass]="sortDirection" (click)="onColClicked('album')">Album</th>
|
|
<th class="four wide" [class.sorted]="sortColumn === 'genre'" [ngClass]="sortDirection" (click)="onColClicked('genre')">Genre</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr
|
|
app-result-table-row
|
|
#tableRow
|
|
*ngFor="let result of results"
|
|
(click)="onRowClicked(result)"
|
|
[class.active]="activeRowID === result.id"
|
|
[result]="result"></tr>
|
|
</tbody>
|
|
</table>
|