push
This commit is contained in:
+7
-1
@@ -97,6 +97,13 @@
|
|||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.hero__logo {
|
||||||
|
max-width: min(420px, 60vw);
|
||||||
|
max-height: 140px;
|
||||||
|
object-fit: contain;
|
||||||
|
margin-bottom: var(--space-4);
|
||||||
|
}
|
||||||
|
|
||||||
.hero__title {
|
.hero__title {
|
||||||
font-size: clamp(2.2rem, 5vw, 3.6rem);
|
font-size: clamp(2.2rem, 5vw, 3.6rem);
|
||||||
line-height: 1.05;
|
line-height: 1.05;
|
||||||
@@ -645,7 +652,6 @@
|
|||||||
.episode-card--current {
|
.episode-card--current {
|
||||||
outline: 2px solid var(--color-accent);
|
outline: 2px solid var(--color-accent);
|
||||||
outline-offset: 2px;
|
outline-offset: 2px;
|
||||||
border-color: var(--color-accent);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.episode-card__thumb {
|
.episode-card__thumb {
|
||||||
|
|||||||
+2
-2
@@ -7,7 +7,7 @@
|
|||||||
<link rel="stylesheet" href="css/tokens.css?v=20260826">
|
<link rel="stylesheet" href="css/tokens.css?v=20260826">
|
||||||
<link rel="stylesheet" href="css/base.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/components.css?v=20260826">
|
||||||
<link rel="stylesheet" href="css/pages.css?v=20260826">
|
<link rel="stylesheet" href="css/pages.css?v=20260828">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header class="site-header">
|
<header class="site-header">
|
||||||
@@ -48,6 +48,6 @@
|
|||||||
<script src="js/storage.js?v=20260826"></script>
|
<script src="js/storage.js?v=20260826"></script>
|
||||||
<script src="js/cards.js?v=20260826"></script>
|
<script src="js/cards.js?v=20260826"></script>
|
||||||
<script src="js/app.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>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
+34
-1
@@ -21,6 +21,36 @@
|
|||||||
return data && Array.isArray(data.results) ? data.results.map(SR.cards.normalizeItem) : [];
|
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 () => {
|
(async () => {
|
||||||
const [movieRes, tvRes] = await Promise.allSettled([
|
const [movieRes, tvRes] = await Promise.allSettled([
|
||||||
SR.api.trending('movie', 'day'),
|
SR.api.trending('movie', 'day'),
|
||||||
@@ -38,7 +68,10 @@
|
|||||||
.filter((item) => item.backdrop && item.overview && item.name)
|
.filter((item) => item.backdrop && item.overview && item.name)
|
||||||
.slice(0, 6);
|
.slice(0, 6);
|
||||||
const hero = SR.cards.heroCarousel(heroData);
|
const hero = SR.cards.heroCarousel(heroData);
|
||||||
if (hero) heroSlot.appendChild(hero);
|
if (hero) {
|
||||||
|
heroSlot.appendChild(hero);
|
||||||
|
loadHeroLogos(hero, heroData);
|
||||||
|
}
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
SR.app.showError(e, 'could not load featured titles');
|
SR.app.showError(e, 'could not load featured titles');
|
||||||
}
|
}
|
||||||
|
|||||||
+2
-1
@@ -441,7 +441,8 @@
|
|||||||
? `url("${SR.util.escapeHtml(SR.util.tmdbResize(backdrop, 'w1280'))}")`
|
? `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) {
|
if (logo) {
|
||||||
heroTitleCard.alt = title;
|
heroTitleCard.alt = title;
|
||||||
heroTitleCard.src = SR.util.tmdbResize(logo, 'w500');
|
heroTitleCard.src = SR.util.tmdbResize(logo, 'w500');
|
||||||
|
|||||||
+1
-1
@@ -7,7 +7,7 @@
|
|||||||
<link rel="stylesheet" href="css/tokens.css?v=20260826">
|
<link rel="stylesheet" href="css/tokens.css?v=20260826">
|
||||||
<link rel="stylesheet" href="css/base.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/components.css?v=20260826">
|
||||||
<link rel="stylesheet" href="css/pages.css?v=20260826">
|
<link rel="stylesheet" href="css/pages.css?v=20260828">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header class="site-header">
|
<header class="site-header">
|
||||||
|
|||||||
+1
-1
@@ -7,7 +7,7 @@
|
|||||||
<link rel="stylesheet" href="css/tokens.css?v=20260826">
|
<link rel="stylesheet" href="css/tokens.css?v=20260826">
|
||||||
<link rel="stylesheet" href="css/base.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/components.css?v=20260826">
|
||||||
<link rel="stylesheet" href="css/pages.css?v=20260826">
|
<link rel="stylesheet" href="css/pages.css?v=20260828">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header class="site-header">
|
<header class="site-header">
|
||||||
|
|||||||
+2
-2
@@ -7,7 +7,7 @@
|
|||||||
<link rel="stylesheet" href="css/tokens.css?v=20260827">
|
<link rel="stylesheet" href="css/tokens.css?v=20260827">
|
||||||
<link rel="stylesheet" href="css/base.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/components.css?v=20260827">
|
||||||
<link rel="stylesheet" href="css/pages.css?v=20260827">
|
<link rel="stylesheet" href="css/pages.css?v=20260828">
|
||||||
</head>
|
</head>
|
||||||
<body class="watch-page">
|
<body class="watch-page">
|
||||||
<header class="site-header">
|
<header class="site-header">
|
||||||
@@ -130,6 +130,6 @@
|
|||||||
<script src="js/cards.js?v=20260827"></script>
|
<script src="js/cards.js?v=20260827"></script>
|
||||||
<script src="js/app.js?v=20260827"></script>
|
<script src="js/app.js?v=20260827"></script>
|
||||||
<script src="js/player.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>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Reference in New Issue
Block a user