Update music page design

This commit is contained in:
floppydiskette 2024-02-08 22:40:36 +00:00
parent 5cadd66a30
commit 50390e8e05
Signed by: fwoppydwisk
SSH key fingerprint: SHA256:Hqn452XQ1ETzUt/FthJu6+OFkS4NBxCv5VQSEvuk7CE
2 changed files with 24 additions and 7 deletions

View file

@ -488,3 +488,22 @@ #scheme-selector {
background-color: var(--background-secondary); background-color: var(--background-secondary);
color: var(--foreground) color: var(--foreground)
} }
.music-top10 td {
border: none;
border-left: 1px dotted var(--foreground);
padding: 2px 5px
}
.music-top10 tr:nth-child(2) td {
border-bottom: 1px dotted var(--foreground);
}
.music-top10 tr:nth-child(3) td {
padding-top: 5px;
}
.music-top10 td:first-child {
border: none;
}

View file

@ -35,14 +35,12 @@
<a href="{{ $current_track->url }}">{{ $current_track->title }} {{ $current_track->artist }}</a><br> <a href="{{ $current_track->url }}">{{ $current_track->title }} {{ $current_track->artist }}</a><br>
</td> </td>
</tr> </tr>
</table>
<hr>
<table class="music-top10">
<tr> <tr>
<td colspan="4"> <td colspan="4">
<hr> <h2 style="margin-bottom: 5px">Top {{ $cfg['toptracks'] }} Tracks (Last 7 days)</h2>
</td>
</tr>
<tr>
<td colspan="4">
<h2>Top {{ $cfg['toptracks'] }} Tracks (Last 7 days)</h2>
</td> </td>
</tr> </tr>
<tr> <tr>
@ -58,7 +56,7 @@
@endif @endif
<tr> <tr>
<td style="text-align: right">{{ $count }}</td> <td style="text-align: right">{{ $count }}</td>
<td style="white-space: nowrap; text-overflow:ellipsis; overflow: hidden; max-width:1px;" width="50%">{{ $track->title }}</td> <td style="white-space: nowrap; text-overflow:ellipsis; overflow: hidden; max-width:1px;" width="50%"><a href="{{ $track->url }}">{{ $track->title }}</a></td>
<td style="white-space: nowrap; text-overflow:ellipsis; overflow: hidden; max-width:1px;" width="50%">{{ $track->artist }}</td> <td style="white-space: nowrap; text-overflow:ellipsis; overflow: hidden; max-width:1px;" width="50%">{{ $track->artist }}</td>
<td>{{ $track->playcount }}</td> <td>{{ $track->playcount }}</td>
</tr> </tr>