diff --git a/furumi-server/src/web/player.html b/furumi-server/src/web/player.html index b61931e..513a7bb 100644 --- a/furumi-server/src/web/player.html +++ b/furumi-server/src/web/player.html @@ -238,14 +238,15 @@ body { .queue-item .qi-info { flex: 1; overflow: hidden; } .queue-item .qi-title { font-size: 0.875rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .queue-item .qi-artist { font-size: 0.75rem; color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } -.queue-item .qi-dur { font-size: 0.72rem; color: var(--text-muted); flex-shrink: 0; } -.queue-item .qi-remove { - opacity: 0; font-size: 0.8rem; color: var(--text-muted); - background: none; border: none; cursor: pointer; padding: 2px 5px; - border-radius: 4px; transition: all 0.15s; +.queue-item .qi-dur { font-size: 0.75rem; color: var(--text-muted); margin-left: auto; margin-right: 0.5rem; } +.qi-remove, .qi-locate { + background: none; border: none; font-size: 0.9rem; + color: var(--text-muted); cursor: pointer; padding: 0.3rem; + border-radius: 4px; transition: all 0.2s; opacity: 0; } -.queue-item:hover .qi-remove { opacity: 1; } -.queue-item .qi-remove:hover { color: var(--danger); } +.queue-item:hover .qi-remove, .queue-item:hover .qi-locate { opacity: 1; } +.qi-remove:hover { background: rgba(248,113,113,0.15); color: var(--danger); } +.qi-locate:hover { background: rgba(124,106,247,0.15); color: var(--primary); } .queue-item.dragging { opacity: 0.5; background: var(--bg-active); } .queue-item.drag-over { border-top: 2px solid var(--accent); margin-top: -2px; } @@ -772,7 +773,7 @@ async function loadMeta(track) { if (res.ok) { const meta = await res.json(); metaCache[track.path] = meta; - track.meta = meta; + if (queue[idx]) { queue[idx].meta = meta; } updateNowPlaying(track); renderQueue(); } @@ -840,6 +841,7 @@ function renderQueue() {