improve table responsiveness
This commit is contained in:
parent
60e1192e12
commit
2836e934fb
@ -5,9 +5,9 @@
|
|||||||
<tr>
|
<tr>
|
||||||
<th class="pl-0 pr-0 text-center text-muted"></th>
|
<th class="pl-0 pr-0 text-center text-muted"></th>
|
||||||
<th class="text-left">Title</th>
|
<th class="text-left">Title</th>
|
||||||
<th class="text-left">Artist</th>
|
<th class="text-left d-none d-lg-table-cell">Artist</th>
|
||||||
<th v-if="showAlbum" class="text-left">Album</th>
|
<th class="text-left d-none d-md-table-cell" v-if="showAlbum">Album</th>
|
||||||
<th class="text-right">Duration</th>
|
<th class="text-right d-none d-md-table-cell">Duration</th>
|
||||||
<th class="text-right">Actions</th>
|
<th class="text-right">Actions</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
@ -28,11 +28,11 @@
|
|||||||
</td>
|
</td>
|
||||||
<td @click="play(index)">
|
<td @click="play(index)">
|
||||||
{{ item.title }}
|
{{ item.title }}
|
||||||
<div class="hidden-md text-muted">
|
<div class="d-lg-none text-muted">
|
||||||
<small>{{ item.artist }}</small>
|
<small>{{ item.artist }}</small>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td class="d-none d-lg-table-cell">
|
||||||
<template v-if="item.artistId">
|
<template v-if="item.artistId">
|
||||||
<router-link :to="{name: 'artist', params: {id: item.artistId}}">
|
<router-link :to="{name: 'artist', params: {id: item.artistId}}">
|
||||||
{{ item.artist }}
|
{{ item.artist }}
|
||||||
@ -42,12 +42,12 @@
|
|||||||
{{ item.artist }}
|
{{ item.artist }}
|
||||||
</template>
|
</template>
|
||||||
</td>
|
</td>
|
||||||
<td v-if="showAlbum">
|
<td class="d-none d-md-table-cell" v-if="showAlbum">
|
||||||
<router-link :to="{name: 'album', params: {id: item.albumId}}">
|
<router-link :to="{name: 'album', params: {id: item.albumId}}">
|
||||||
{{ item.album }}
|
{{ item.album }}
|
||||||
</router-link>
|
</router-link>
|
||||||
</td>
|
</td>
|
||||||
<td class="text-right">
|
<td class="text-right d-none d-md-table-cell">
|
||||||
{{ item.duration | duration }}
|
{{ item.duration | duration }}
|
||||||
</td>
|
</td>
|
||||||
<td class="text-right">
|
<td class="text-right">
|
||||||
|
Loading…
x
Reference in New Issue
Block a user