josh/ytplayer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make the channel name a visible link directly under the title

Browse Source
This commit is contained in:
Claude
2026-10-01 21:54:39 +00:00
parent fecb824c9a
commit 61a8f63385
2 changed files with 19 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/app.js
View File

@@ -1826,7 +1826,15 @@ const Player = {
els.controls.classList.remove('hidden');
els.nowMeta.classList.remove('hidden');
els.npTitle.textContent = current.meta.title;
els.npChannel.textContent = current.meta.channel || '';
els.npChannel.textContent = '';
{ const name = document.createElement('span');
name.className = 'np-ch-name';
name.textContent = current.meta.channel || '';
els.npChannel.appendChild(name);
const linkable = !!channelKeyOf(current.meta);
els.npChannel.classList.toggle('link', linkable);
if (linkable) { els.npChannel.setAttribute('role', 'link'); els.npChannel.tabIndex = 0; els.npChannel.title = 'Open this channel'; }
else { els.npChannel.removeAttribute('role'); els.npChannel.removeAttribute('tabindex'); } }
updateNowPlayingActions();
markPlayingCard();
showMiniBar();
@@ -9640,6 +9648,7 @@ document.querySelectorAll('.chip').forEach((c) => {
if (current && current.meta) addToQueue(current.meta);
});
// Now-playing channel name → channel view
els.npChannel.addEventListener('keydown', (e) => { if (e.key === 'Enter') els.npChannel.click(); });
els.npChannel.addEventListener('click', () => {
if (current && current.meta && channelKeyOf(current.meta)) {
openChannel(channelKeyOf(current.meta), current.meta.channel);

9
frontend/theme-glass.css
View File

@@ -360,3 +360,12 @@ html[data-layout="glass-stage"] #controls #ctlMoreBtn .mc-dots { display: none;
html[data-layout="glass-stage"] #controls #ctlMoreBtn .mc-label { display: inline !important; }
html[data-layout="glass-stage"] #controls #ctlMoreBtn .mc-rest { display: none !important; }
html[data-layout="glass-stage"] #controls .dk-quick.ab-on #fsBtn .fs-label { display: inline !important; }
/* channel: its own line right under the title, clearly a link */
html[data-layout="glass-stage"] #nowPlayingMeta .np-channel { display: flex; margin: -2px 0 0; }
html[data-layout="glass-stage"] #nowPlayingMeta .np-channel.link .np-ch-name {
color: var(--text); font-weight: 600; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, 0.25); text-underline-offset: 3px;
}
html[data-layout="glass-stage"] #nowPlayingMeta .np-channel.link:hover .np-ch-name { color: var(--accent-bright); text-decoration-color: currentColor; }
html[data-layout="glass-stage"] #nowPlayingMeta .np-channel.link .np-ch-name::after { content: " ›"; color: var(--accent-bright); text-decoration: none; display: inline-block; }
html[data-layout="glass-stage"] #nowPlayingMeta .np-channel:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 6px; }