jellyfin: link Bocken logo to bocken.org with Nord lightblue hover

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-03 17:46:08 +01:00
parent 74c43b1181
commit b035abb061
2 changed files with 51 additions and 2 deletions

View File

@@ -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%);
}
/* ═══════════════════════════════════════════

View File

@@ -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 () {