From 61a8f6338535722d8b2b4c551da025a163068538 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Thu, 1 Oct 2026 21:54:39 +0000
Subject: [PATCH] Make the channel name a visible link directly under the title

---
 frontend/app.js          | 11 ++++++++++-
 frontend/theme-glass.css |  9 +++++++++
 2 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/frontend/app.js b/frontend/app.js
index b2de1c7..f859bee 100755
--- a/frontend/app.js
+++ b/frontend/app.js
@@ -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);
diff --git a/frontend/theme-glass.css b/frontend/theme-glass.css
index ed19db2..77b9d45 100644
--- a/frontend/theme-glass.css
+++ b/frontend/theme-glass.css
@@ -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; }