UI: add menu icon to tracklist header

This commit is contained in:
Julien Maille 2026-01-18 19:06:33 +01:00
parent 1caafdc673
commit 81854c1ffb

View file

@ -1233,7 +1233,7 @@ export class UIRenderer {
<span style="width: 40px; text-align: center;">#</span> <span style="width: 40px; text-align: center;">#</span>
<span>Title</span> <span>Title</span>
<span class="duration-header">Duration</span> <span class="duration-header">Duration</span>
<span></span> <span style="display: flex; justify-content: flex-end; opacity: 0.8;">${SVG_MENU}</span>
</div> </div>
${this.createSkeletonTracks(10, false)} ${this.createSkeletonTracks(10, false)}
`; `;
@ -1287,7 +1287,7 @@ export class UIRenderer {
<span style="width: 40px; text-align: center;">#</span> <span style="width: 40px; text-align: center;">#</span>
<span>Title</span> <span>Title</span>
<span class="duration-header">Duration</span> <span class="duration-header">Duration</span>
<span></span> <span style="display: flex; justify-content: flex-end; opacity: 0.8;">${SVG_MENU}</span>
</div> </div>
`; `;
@ -1461,12 +1461,12 @@ export class UIRenderer {
const tracklistContainer = document.getElementById('playlist-detail-tracklist'); const tracklistContainer = document.getElementById('playlist-detail-tracklist');
if (tracklistContainer && updatedPlaylist.tracks) { if (tracklistContainer && updatedPlaylist.tracks) {
tracklistContainer.innerHTML = ` tracklistContainer.innerHTML = `
<div class="track-list-header"> <div class="track-list-header">
<span style="width: 40px; text-align: center;">#</span> <span style="width: 40px; text-align: center;">#</span>
<span>Title</span> <span>Title</span>
<span class="duration-header">Duration</span> <span class="duration-header">Duration</span>
<span></span> <span style="display: flex; justify-content: flex-end; opacity: 0.8;">${SVG_MENU}</span>
</div> `; </div> `;
this.renderListWithTracks(tracklistContainer, updatedPlaylist.tracks, true); this.renderListWithTracks(tracklistContainer, updatedPlaylist.tracks, true);
if (document.querySelector('.remove-from-playlist-btn')) { if (document.querySelector('.remove-from-playlist-btn')) {
@ -1536,7 +1536,7 @@ export class UIRenderer {
<span style="width: 40px; text-align: center;">#</span> <span style="width: 40px; text-align: center;">#</span>
<span>Title</span> <span>Title</span>
<span class="duration-header">Duration</span> <span class="duration-header">Duration</span>
<span></span> <span style="display: flex; justify-content: flex-end; opacity: 0.8;">${SVG_MENU}</span>
</div> </div>
${this.createSkeletonTracks(10, true)} ${this.createSkeletonTracks(10, true)}
`; `;
@ -1588,7 +1588,7 @@ export class UIRenderer {
<span style="width: 40px; text-align: center;">#</span> <span style="width: 40px; text-align: center;">#</span>
<span>Title</span> <span>Title</span>
<span class="duration-header">Duration</span> <span class="duration-header">Duration</span>
<span></span> <span style="display: flex; justify-content: flex-end; opacity: 0.8;">${SVG_MENU}</span>
</div> </div>
`; `;
@ -1687,7 +1687,7 @@ export class UIRenderer {
<span style="width: 40px; text-align: center;">#</span> <span style="width: 40px; text-align: center;">#</span>
<span>Title</span> <span>Title</span>
<span class="duration-header">Duration</span> <span class="duration-header">Duration</span>
<span></span> <span style="display: flex; justify-content: flex-end; opacity: 0.8;">${SVG_MENU}</span>
</div> </div>
`; `;
@ -1750,7 +1750,7 @@ export class UIRenderer {
<span style="width: 40px; text-align: center;">#</span> <span style="width: 40px; text-align: center;">#</span>
<span>Title</span> <span>Title</span>
<span class="duration-header">Duration</span> <span class="duration-header">Duration</span>
<span></span> <span style="display: flex; justify-content: flex-end; opacity: 0.8;">${SVG_MENU}</span>
</div> </div>
${this.createSkeletonTracks(10, true)} ${this.createSkeletonTracks(10, true)}
`; `;
@ -1791,7 +1791,7 @@ export class UIRenderer {
<span style="width: 40px; text-align: center;">#</span> <span style="width: 40px; text-align: center;">#</span>
<span>Title</span> <span>Title</span>
<span class="duration-header">Duration</span> <span class="duration-header">Duration</span>
<span></span> <span style="display: flex; justify-content: flex-end; opacity: 0.8;">${SVG_MENU}</span>
</div> </div>
`; `;