From b035abb061480788d5cf9f23893f77f8663a479d Mon Sep 17 00:00:00 2001
From: Alexander Bocken <alexander@bocken.org>
Date: Tue, 3 Mar 2026 17:46:08 +0100
Subject: [PATCH] jellyfin: link Bocken logo to bocken.org with Nord lightblue
 hover

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 static/other/jellyfin.css | 13 ++++++++++++-
 static/other/jellyfin.js  | 40 ++++++++++++++++++++++++++++++++++++++-
 2 files changed, 51 insertions(+), 2 deletions(-)

diff --git a/static/other/jellyfin.css b/static/other/jellyfin.css
index aadd9ed..5e7c7fc 100644
--- a/static/other/jellyfin.css
+++ b/static/other/jellyfin.css
@@ -230,7 +230,18 @@ progress[value]::-moz-progress-bar {
     background-color: #000;
 }
 .pageTitleWithDefaultLogo {
-    background-image: url(https://bocken.org/static/css/logos/logo_text_light.png);
+    background-image: url(https://bocken.org/static/css/logos/logo_full_light.png);
+}
+
+/* Bocken logo link */
+.bocken-logo-link {
+  display: flex;
+  text-decoration: none;
+  transition: filter 150ms;
+}
+.bocken-logo-link:hover .pageTitleWithDefaultLogo {
+  /* Tint white logo to Nord lightblue (#81A1C1) */
+  filter: brightness(0) saturate(100%) invert(61%) sepia(52%) saturate(212%) hue-rotate(169deg) brightness(92%) contrast(94%);
 }
 
 /* ═══════════════════════════════════════════
diff --git a/static/other/jellyfin.js b/static/other/jellyfin.js
index 20e63eb..f0b8ef4 100644
--- a/static/other/jellyfin.js
+++ b/static/other/jellyfin.js
@@ -135,7 +135,45 @@
 })();
 
 /* ═══════════════════════════════════════════
-   2. Click card thumbnail to play video
+   2. Make Bocken logo link to bocken.org
+   ═══════════════════════════════════════════ */
+(function () {
+  function wrapLogo() {
+    var logo = document.querySelector('.pageTitleWithDefaultLogo');
+    if (!logo || logo.dataset.bockenLinked) return;
+    logo.dataset.bockenLinked = '1';
+
+    var link = document.createElement('a');
+    link.href = 'https://bocken.org';
+    link.className = 'bocken-logo-link';
+    link.title = 'bocken.org';
+    logo.parentNode.insertBefore(link, logo);
+    link.appendChild(logo);
+  }
+
+  var pending = null;
+  function schedule() {
+    if (pending) return;
+    pending = setTimeout(function () {
+      pending = null;
+      wrapLogo();
+    }, 300);
+  }
+
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', schedule);
+  } else {
+    schedule();
+  }
+
+  new MutationObserver(schedule).observe(document.body, {
+    childList: true,
+    subtree: true,
+  });
+})();
+
+/* ═══════════════════════════════════════════
+   3. Click card thumbnail to play video
       + play triangle overlay on cards
    ═══════════════════════════════════════════ */
 (function () {