shishantbiswas/JustAnime
1
0
Fork 0
mirror of https://github.com/JustAnimeCore/JustAnime.git synced 2026-04-17 13:51:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

seasons

Browse Source
This commit is contained in:
Tejas Panchal
2026-03-01 15:58:41 +05:30
parent e43b9c70e9
commit 79ad7c4c4e
1 changed files with 31 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
src/pages/watch/Watch.jsx
View File

@@ -352,28 +352,6 @@ export default function Watch() {
</div>
</div>
{/* Seasons (Mobile only) */}
{seasons?.length > 0 && (
<div className="hidden max-[1200px]:block w-full bg-[#141414] rounded-xl p-4 shadow-lg border border-white/5">
<h2 className="text-lg font-bold mb-4 text-white">More Seasons</h2>
<div className="grid grid-cols-2 gap-3">
{seasons.map((season, idx) => (
<Link
to={`/${season.id}`}
key={idx}
className={`relative aspect-[3/1] rounded-lg overflow-hidden group border-2 transition-all ${animeId === String(season.id) ? "border-white/40 shadow-lg" : "border-transparent"}`}
>
<img src={season.season_poster} alt={season.season} className={`w-full h-full object-cover scale-150 transition-opacity ${animeId === String(season.id) ? "opacity-60" : "opacity-40 group-hover:opacity-60"}`} />
<div className="absolute inset-0 bg-gradient-to-r from-black/80 to-transparent z-10" />
<div className="absolute inset-0 flex items-center justify-center z-20 px-2">
<p className="text-xs font-bold text-white text-center line-clamp-2">{season.season}</p>
</div>
</Link>
))}
</div>
</div>
)}
{/* Related Anime (Mobile only) */}
{!animeInfoLoading && animeInfo?.related_data?.length > 0 && (
<div className="hidden max-[1200px]:block w-full bg-[#141414] rounded-xl p-4 shadow-lg border border-white/5">
@@ -406,10 +384,39 @@ export default function Watch() {
</div>
)}
</div>
</div>
</div>
{/* Sections */}
<div className="container mx-auto space-y-8 pb-12 lg:px-6">
{seasons?.length > 0 && (
<div>
<h2 className="text-2xl font-bold mb-6 px-1 text-white">More Seasons</h2>
<div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
{seasons.map((season, index) => (
<Link
to={`/${season.id}`}
key={index}
className={`relative w-full aspect-[3/1] rounded-lg overflow-hidden group border-2 transition-all ${animeId === String(season.id) ? "border-white/40 shadow-lg" : "border-transparent"}`}
>
<img src={season.season_poster} alt={season.season} className={`w-full h-full object-cover scale-150 transition-opacity ${animeId === String(season.id) ? "opacity-50" : "opacity-40 group-hover:opacity-60"}`} />
<div
className="absolute inset-0 z-10"
style={{
backgroundImage: `url('data:image/svg+xml,<svg width="3" height="3" viewBox="0 0 3 3" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="1.5" cy="1.5" r="0.5" fill="white" fill-opacity="0.25"/></svg>')`,
backgroundSize: '3px 3px'
}}
/>
<div className="absolute inset-0 z-20 bg-gradient-to-r from-black/60 to-transparent" />
<div className="absolute inset-0 z-30 flex items-center justify-center">
<p className="text-sm sm:text-base font-bold text-center px-4 text-white">{season.season}</p>
</div>
</Link>
))}
</div>
</div>
)}
</div>
</div>
</>
);