This commit is contained in:
4DBug
2026-08-27 11:28:55 -05:00
parent daea02d0fc
commit a1c3d20eb7
7 changed files with 49 additions and 9 deletions
+7 -1
View File
@@ -97,6 +97,13 @@
text-transform: uppercase;
}
.hero__logo {
max-width: min(420px, 60vw);
max-height: 140px;
object-fit: contain;
margin-bottom: var(--space-4);
}
.hero__title {
font-size: clamp(2.2rem, 5vw, 3.6rem);
line-height: 1.05;
@@ -645,7 +652,6 @@
.episode-card--current {
outline: 2px solid var(--color-accent);
outline-offset: 2px;
border-color: var(--color-accent);
}
.episode-card__thumb {
+2 -2
View File
@@ -7,7 +7,7 @@
<link rel="stylesheet" href="css/tokens.css?v=20260826">
<link rel="stylesheet" href="css/base.css?v=20260826">
<link rel="stylesheet" href="css/components.css?v=20260826">
<link rel="stylesheet" href="css/pages.css?v=20260826">
<link rel="stylesheet" href="css/pages.css?v=20260828">
</head>
<body>
<header class="site-header">
@@ -48,6 +48,6 @@
<script src="js/storage.js?v=20260826"></script>
<script src="js/cards.js?v=20260826"></script>
<script src="js/app.js?v=20260826"></script>
<script src="js/home.js?v=20260826"></script>
<script src="js/home.js?v=20260829"></script>
</body>
</html>
+34 -1
View File
@@ -21,6 +21,36 @@
return data && Array.isArray(data.results) ? data.results.map(SR.cards.normalizeItem) : [];
}
function loadHeroLogos(section, items) {
const slides = section.querySelectorAll('.hero__slide');
items.forEach((item, i) => {
const slide = slides[i];
if (!slide || !item || item.tmdbId == null) return;
const titleEl = slide.querySelector('.hero__title');
if (!titleEl) return;
const logo = document.createElement('img');
logo.className = 'hero__logo';
logo.alt = item.name;
logo.hidden = true;
titleEl.insertAdjacentElement('beforebegin', logo);
SR.api.details(item.type, item.tmdbId)
.then((details) => {
const images = (details && details.images) || {};
const logos = images.logos || [];
const url = (logos.find((l) => l && l.url && String(l.iso_639_1 || '').toLowerCase() === 'en') || {}).url;
if (!url) return;
logo.onerror = () => {
logo.hidden = true;
titleEl.hidden = false;
};
logo.src = SR.util.tmdbResize(url, 'w500');
logo.hidden = false;
titleEl.hidden = true;
})
.catch(() => {});
});
}
(async () => {
const [movieRes, tvRes] = await Promise.allSettled([
SR.api.trending('movie', 'day'),
@@ -38,7 +68,10 @@
.filter((item) => item.backdrop && item.overview && item.name)
.slice(0, 6);
const hero = SR.cards.heroCarousel(heroData);
if (hero) heroSlot.appendChild(hero);
if (hero) {
heroSlot.appendChild(hero);
loadHeroLogos(hero, heroData);
}
} catch (e) {
SR.app.showError(e, 'could not load featured titles');
}
+2 -1
View File
@@ -441,7 +441,8 @@
? `url("${SR.util.escapeHtml(SR.util.tmdbResize(backdrop, 'w1280'))}")`
: '';
const logo = images.logos && images.logos[0] && images.logos[0].url;
const logos = images.logos || [];
const logo = (logos.find((l) => l && l.url && String(l.iso_639_1 || '').toLowerCase() === 'en') || {}).url;
if (logo) {
heroTitleCard.alt = title;
heroTitleCard.src = SR.util.tmdbResize(logo, 'w500');
+1 -1
View File
@@ -7,7 +7,7 @@
<link rel="stylesheet" href="css/tokens.css?v=20260826">
<link rel="stylesheet" href="css/base.css?v=20260826">
<link rel="stylesheet" href="css/components.css?v=20260826">
<link rel="stylesheet" href="css/pages.css?v=20260826">
<link rel="stylesheet" href="css/pages.css?v=20260828">
</head>
<body>
<header class="site-header">
+1 -1
View File
@@ -7,7 +7,7 @@
<link rel="stylesheet" href="css/tokens.css?v=20260826">
<link rel="stylesheet" href="css/base.css?v=20260826">
<link rel="stylesheet" href="css/components.css?v=20260826">
<link rel="stylesheet" href="css/pages.css?v=20260826">
<link rel="stylesheet" href="css/pages.css?v=20260828">
</head>
<body>
<header class="site-header">
+2 -2
View File
@@ -7,7 +7,7 @@
<link rel="stylesheet" href="css/tokens.css?v=20260827">
<link rel="stylesheet" href="css/base.css?v=20260827">
<link rel="stylesheet" href="css/components.css?v=20260827">
<link rel="stylesheet" href="css/pages.css?v=20260827">
<link rel="stylesheet" href="css/pages.css?v=20260828">
</head>
<body class="watch-page">
<header class="site-header">
@@ -130,6 +130,6 @@
<script src="js/cards.js?v=20260827"></script>
<script src="js/app.js?v=20260827"></script>
<script src="js/player.js?v=20260827"></script>
<script src="js/watch.js?v=20260827"></script>
<script src="js/watch.js?v=20260829"></script>
</body>
</html>