diff --git a/src/components.js b/src/components.js index 909074f..f2e9e72 100644 --- a/src/components.js +++ b/src/components.js @@ -39,7 +39,7 @@ export function makeSongItem(s, idx, list, { noArtistLink = false, noAlbumLink = return noArtistLink ? `${esc(name)}` : `${esc(name)}`; - }).join(' / ') + }).join(' • ') : ''; const albumHtml = !noAlbumLink && (s.albumId||s.album) ? ` · ${esc(s.album||'')}` diff --git a/src/player.js b/src/player.js index ba4860d..314933b 100644 --- a/src/player.js +++ b/src/player.js @@ -31,7 +31,7 @@ export function updatePlayerUI(s) { ? artistParts.map((name, i) => { const aid = i === 0 ? (s.artistId || '') : ''; return `${esc(name)}`; - }).join(' / ') + }).join(' • ') : '—'; document.getElementById('player-album-sep').style.display = s.album ? '' : 'none'; document.getElementById('player-album-name').textContent = s.album || ''; @@ -70,7 +70,7 @@ export function _syncNpDirect(s) { ? parts.map((name, i) => { const aid = i === 0 ? (s.artistId || '') : ''; return `${esc(name)}`; - }).join(' / ') + }).join(' • ') : '—'; } const asep = document.getElementById('np-album-sep'); if(asep) asep.style.display = s.album ? '' : 'none'; @@ -365,7 +365,7 @@ export function _restoreLastPlayed() { ? artistParts.map((name, i) => { const aid = i === 0 ? (s.artistId || '') : ''; return `${esc(name)}`; - }).join(' / ') + }).join(' • ') : '—'; document.getElementById('player-album-sep').style.display = s.album ? '' : 'none'; document.getElementById('player-album-name').textContent = s.album || ''; diff --git a/src/views.js b/src/views.js index 5b24531..97a3875 100644 --- a/src/views.js +++ b/src/views.js @@ -426,7 +426,7 @@ export async function loadAlbumDetail(album) { artistEl.innerHTML = albumArtistParts.map((name, i) => { const aid = i === 0 ? (album.artistId || '') : ''; return `${esc(name)}`; - }).join(' / ') || ''; + }).join(' • ') || ''; const cw = document.getElementById('album-cover-wrap'); const cv = coverUrl(album.coverArt, 300); cw.innerHTML = cv ? `` : '
💿
'; diff --git a/styles.css b/styles.css index 524a951..810049c 100644 --- a/styles.css +++ b/styles.css @@ -193,7 +193,7 @@ nav{flex:1;overflow-y:auto;padding:4px 10px} /* Player bar clickable title/artist */ .player-title:hover{color:var(--accent);text-decoration:underline} #player-artist-name{color:var(--text2)} -#player-artist-name:hover{color:var(--accent-2,#f0b840)} +#player-artist-name span:hover{color:var(--accent-2,#f0b840)} #player-album-name{color:var(--text3)} #player-album-name:hover{color:var(--accent)} @@ -537,7 +537,7 @@ nav{flex:1;overflow-y:auto;padding:4px 10px} .np-text{flex:1;min-width:0} .np-title{font-size:22px;font-weight:800;letter-spacing:-.4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:5px} .np-artist{font-size:15px;color:rgba(255,255,255,.65);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .15s} -#np-artist-name:hover,#np-album-name:hover{color:var(--accent);cursor:pointer} +#np-artist-name span:hover,#np-album-name:hover{color:var(--accent);cursor:pointer} .np-star{ background:none;border:none;cursor:pointer; padding:8px;margin-left:8px;flex-shrink:0;