starred/newznab-tmux
1
0
Fork 0
mirror of https://github.com/NNTmux/newznab-tmux.git synced 2026-08-28 17:01:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve the looks of movie page

Browse Source
This commit is contained in:
DariusIII
2026-03-06 15:41:54 +01:00
parent 7313b9c490
commit 34eec8b069
6 changed files with 103 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/css/csp-safe.css
+62
View File
@@ -947,3 +947,65 @@ code.api-token::-webkit-scrollbar-thumb:hover {
padding: 0;
}
/* ------------------------------------------------------------------ */
/* Detail pages: shared card and image shadows */
/* ------------------------------------------------------------------ */
.release-detail-page {
@apply shadow-md;
}
.release-detail-page .surface-panel-alt,
.release-detail-page .detail-password-card,
.release-detail-page .detail-file-list,
.release-detail-page .detail-info-sidebar,
.release-detail-page .detail-empty-comments {
@apply shadow-sm;
}
.release-detail-page .detail-comment-card {
@apply shadow-sm hover:shadow-md transition-shadow duration-300;
}
.release-detail-page .detail-cover-image {
@apply rounded-xl shadow-xl;
}
.release-detail-page .detail-gallery-image {
@apply shadow-md hover:shadow-lg transition-shadow duration-300;
}
.movie-detail-page {
@apply shadow-md;
}
.movie-detail-page .movie-detail-poster {
@apply rounded-xl shadow-xl;
}
.movie-detail-page .movie-detail-trailer {
@apply overflow-hidden rounded-xl shadow-lg;
}
.movie-detail-page .movie-release-card {
@apply shadow-sm hover:shadow-md transition-shadow duration-300;
}
.series-detail-page {
@apply shadow-md;
}
.series-detail-page .series-main-card,
.series-detail-page .series-episodes-card {
@apply shadow-md;
}
.series-detail-page .series-stat-card,
.series-detail-page .series-episode-card {
@apply shadow-sm hover:shadow-md transition-shadow duration-300;
}
.series-detail-page .series-detail-poster {
@apply rounded-xl shadow-xl transition-shadow duration-300;
}
resources/views/details/index.blade.php
+9 -10
View File
@@ -5,7 +5,7 @@
@endpush
@section('content')
<div class="surface-panel rounded-xl shadow-sm p-6">
<div class="release-detail-page surface-panel rounded-xl shadow-sm p-6">
<div class="mb-6">
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-200 mb-2">Release Details</h1>
<nav class="text-sm text-gray-600 dark:text-gray-400">
@@ -25,8 +25,7 @@
<div class="shrink-0">
<img src="{{ getReleaseCover($release) }}"
alt="{{ $release->searchname }}"
class="w-48 h-72 object-cover rounded-lg shadow-md max-w-[192px] max-h-[288px]"
class="rounded-lg shadow-lg object-cover w-3xl h-288"
class="detail-cover-image w-48 h-72 object-cover max-w-[192px] max-h-[288px]"
data-fallback-src="{{ asset('assets/images/no-cover.png') }}">
</div>
@@ -100,7 +99,7 @@
<div class="block cursor-pointer image-modal-trigger" data-image-url="{{ url('/covers/preview/' . $release->guid . '_thumb.jpg') }}" data-image-title="Preview Image">
<img src="{{ url('/covers/preview/' . $release->guid . '_thumb.jpg') }}"
alt="Preview"
class="w-full h-auto rounded-lg shadow-md hover:shadow-lg transition"
class="detail-gallery-image w-full h-auto rounded-lg"
loading="lazy">
</div>
<p class="text-xs text-gray-500 mt-1 text-center">Preview</p>
@@ -113,7 +112,7 @@
<div class="block cursor-pointer image-modal-trigger" data-image-url="{{ url('/covers/sample/' . $release->guid . '_thumb.jpg') }}" data-image-title="Sample Image">
<img src="{{ url('/covers/sample/' . $release->guid . '_thumb.jpg') }}"
alt="Sample"
class="w-full h-auto rounded-lg shadow-md hover:shadow-lg transition"
class="detail-gallery-image w-full h-auto rounded-lg"
loading="lazy">
</div>
<p class="text-xs text-gray-500 mt-1 text-center">Sample</p>
@@ -679,7 +678,7 @@
<!-- Password Information -->
@if(isset($release->passwordstatus) && $release->passwordstatus > 0)
<div class="bg-linear-to-r from-red-50 to-orange-50 dark:from-red-900 dark:to-orange-900 rounded-lg p-6 border border-red-100 dark:border-red-800">
<div class="detail-password-card bg-linear-to-r from-red-50 to-orange-50 dark:from-red-900 dark:to-orange-900 rounded-lg p-6 border border-red-100 dark:border-red-800">
<h3 class="text-lg font-semibold text-gray-800 dark:text-gray-200 mb-4 flex items-center">
<i class="fas fa-lock mr-2 text-red-600 dark:text-red-400"></i> Password Protected Release
</h3>
@@ -918,7 +917,7 @@
@if(isset($files) && count($files) > 0)
<div>
<h3 class="text-lg font-semibold text-gray-800 dark:text-gray-200 mb-3">Files ({{ count($files) }})</h3>
<div class="surface-panel-alt rounded-lg overflow-hidden border">
<div class="detail-file-list surface-panel-alt rounded-lg overflow-hidden border">
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<thead class="surface-panel-alt">
<tr>
@@ -1007,7 +1006,7 @@
@if(isset($comments) && count($comments) > 0)
<div class="space-y-4">
@foreach($comments as $comment)
<div class="bg-gray-50 dark:bg-gray-900 rounded-lg p-4 border border-gray-200 dark:border-gray-700 hover:border-gray-300 dark:hover:border-gray-600 transition">
<div class="detail-comment-card bg-gray-50 dark:bg-gray-900 rounded-lg p-4 border border-gray-200 dark:border-gray-700 hover:border-gray-300 dark:hover:border-gray-600 transition">
<div class="flex items-start justify-between mb-3">
<div class="flex items-center">
<div class="w-10 h-10 bg-primary-600 dark:bg-primary-700 rounded-full flex items-center justify-center text-white font-bold mr-3 shadow-sm">
@@ -1027,7 +1026,7 @@
@endforeach
</div>
@else
<div class="bg-gray-50 dark:bg-gray-900 rounded-lg p-8 border border-gray-200 dark:border-gray-700 text-center">
<div class="detail-empty-comments bg-gray-50 dark:bg-gray-900 rounded-lg p-8 border border-gray-200 dark:border-gray-700 text-center">
<i class="fas fa-comments text-4xl text-gray-400 dark:text-gray-600 mb-3"></i>
<p class="text-gray-500 dark:text-gray-400">No comments yet. Be the first to comment!</p>
</div>
@@ -1037,7 +1036,7 @@
<!-- Sidebar -->
<div class="lg:col-span-1">
<div class="surface-panel-alt rounded-lg p-4 sticky top-4 border">
<div class="detail-info-sidebar surface-panel-alt rounded-lg p-4 sticky top-4 border">
<h3 class="text-lg font-semibold text-gray-800 dark:text-gray-200 mb-4">Information</h3>
<dl class="space-y-3">
<div>
resources/views/movies/partials/movie-card.blade.php
+8 -8
View File
@@ -14,19 +14,19 @@
$guid = !empty($releases) ? $releases[0]->guid : null;
@endphp
<div class="surface-panel border rounded-xl overflow-hidden hover:shadow-xl transition-shadow duration-300">
<div class="surface-panel border rounded-xl shadow-md overflow-hidden hover:shadow-xl transition-shadow duration-300">
<div class="flex flex-row">
{{-- Movie Poster --}}
<div class="shrink-0">
<div class="shrink-0 p-4">
@if($guid)
<a href="{{ url('/details/' . $guid) }}" class="block">
@if(isset($result->cover) && $result->cover)
<img src="{{ $result->cover }}"
alt="{{ $result->title }}"
class="object-cover movie-cover"
class="object-cover movie-cover rounded-lg shadow-lg"
loading="lazy">
@else
<div class="bg-gray-200 dark:bg-gray-700 flex items-center justify-center movie-cover">
<div class="bg-gray-200 dark:bg-gray-700 flex items-center justify-center movie-cover rounded-lg shadow-lg">
<i class="fas fa-film text-gray-400 text-3xl"></i>
</div>
@endif
@@ -35,10 +35,10 @@
@if(isset($result->cover) && $result->cover)
<img src="{{ $result->cover }}"
alt="{{ $result->title }}"
class="object-cover movie-cover"
class="object-cover movie-cover rounded-lg shadow-lg"
loading="lazy">
@else
<div class="bg-gray-200 dark:bg-gray-700 flex items-center justify-center movie-cover">
<div class="bg-gray-200 dark:bg-gray-700 flex items-center justify-center movie-cover rounded-lg shadow-lg">
<i class="fas fa-film text-gray-400 text-3xl"></i>
</div>
@endif
@@ -46,7 +46,7 @@
</div>
{{-- Movie Details --}}
<div class="flex-1 p-4 min-w-0">
<div class="flex-1 py-4 pr-4 min-w-0">
{{-- Title --}}
<div class="flex justify-between items-start mb-2">
<div class="flex-1 min-w-0">
@@ -138,7 +138,7 @@
<div class="space-y-3">
@foreach($releases as $index => $release)
@if(($release->searchname ?? null) && ($release->guid ?? null))
<div class="bg-gray-50 dark:bg-gray-900 rounded-lg p-3 border border-gray-200 dark:border-gray-700">
<div class="bg-gray-50 dark:bg-gray-900 rounded-lg p-3 border border-gray-200 dark:border-gray-700 shadow-sm">
<div class="release-card-container">
<div class="release-info-wrapper">
{{-- Release Name --}}
resources/views/movies/trending.blade.php
+5 -5
View File
@@ -35,7 +35,7 @@
<div class="px-6 py-6">
<div class="grid grid-cols-1 gap-6">
@foreach($trendingMovies as $index => $movie)
<div class="surface-panel border rounded-lg overflow-hidden hover:shadow-xl transition-shadow duration-300">
<div class="surface-panel relative border rounded-lg shadow-md overflow-hidden hover:shadow-xl transition-shadow duration-300">
<div class="flex flex-col md:flex-row">
<!-- Rank Badge -->
<div class="absolute top-4 left-4 z-10">
@@ -46,12 +46,12 @@
</div>
<!-- Movie Poster -->
<div class="shrink-0 relative">
<div class="shrink-0 relative p-4">
<a href="{{ route('movie.view', ['imdbid' => $movie->imdbid]) }}" class="block">
@if($movie->cover)
<img src="{{ $movie->cover }}" alt="{{ $movie->title }}" class="w-full md:w-64 h-96 object-cover">
<img src="{{ $movie->cover }}" alt="{{ $movie->title }}" class="w-full md:w-64 h-96 object-cover rounded-xl shadow-xl">
@else
<div class="w-full md:w-64 h-96 bg-gray-200 dark:bg-gray-700 flex items-center justify-center">
<div class="w-full md:w-64 h-96 bg-gray-200 dark:bg-gray-700 flex items-center justify-center rounded-xl shadow-xl">
<i class="fas fa-film text-gray-400 text-5xl"></i>
</div>
@endif
@@ -63,7 +63,7 @@
</div>
<!-- Movie Details -->
<div class="flex-1 p-6 ml-0 md:ml-4">
<div class="flex-1 py-6 pr-6 min-w-0">
<div class="flex flex-col h-full">
<!-- Title and Info -->
<div class="flex-1">
resources/views/movies/viewmoviefull.blade.php
+5 -5
View File
@@ -1,7 +1,7 @@
@extends('layouts.main')
@section('content')
<div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm">
<div class="movie-detail-page bg-white dark:bg-gray-800 rounded-xl shadow-sm">
<x-breadcrumb :items="[
['label' => 'Home', 'url' => url($site['home_link'] ?? '/'), 'icon' => 'fas fa-home'],
['label' => 'Movies', 'url' => route('Movies')],
@@ -14,9 +14,9 @@
<!-- Movie Poster -->
<div class="lg:col-span-1">
@if(!empty($movie['cover'] ?? null))
<img src="{{ $movie['cover'] }}" alt="{{ $movie['title'] ?? 'Movie' }}" class="w-full rounded-lg shadow-lg">
<img src="{{ $movie['cover'] }}" alt="{{ $movie['title'] ?? 'Movie' }}" class="movie-detail-poster w-full rounded-lg">
@else
<div class="w-full h-96 bg-gray-200 dark:bg-gray-700 rounded-lg flex items-center justify-center">
<div class="movie-detail-poster w-full h-96 bg-gray-200 dark:bg-gray-700 rounded-lg flex items-center justify-center">
<i class="fas fa-film text-gray-400 text-6xl"></i>
</div>
@endif
@@ -115,7 +115,7 @@
@if(!empty($movie['trailer'] ?? null))
<div class="mb-6">
<h2 class="text-xl font-semibold text-gray-900 dark:text-gray-100 mb-2">Trailer</h2>
<div class="aspect-video">
<div class="movie-detail-trailer aspect-video">
{!! $movie['trailer'] !!}
</div>
</div>
@@ -180,7 +180,7 @@
<div class="space-y-3" id="releases-container">
@foreach($releases as $release)
<div class="release-item bg-gray-50 dark:bg-gray-900 rounded-lg p-4 border border-gray-200 dark:border-gray-700 hover:shadow-md transition" data-release-name="{{ strtolower($release->searchname) }}">
<div class="movie-release-card release-item bg-gray-50 dark:bg-gray-900 rounded-lg p-4 border border-gray-200 dark:border-gray-700" data-release-name="{{ strtolower($release->searchname) }}">
<div class="flex flex-col lg:flex-row lg:items-center justify-between gap-3">
<div class="flex-1 min-w-0">
<a href="{{ url('/details/' . $release->guid) }}" class="text-base text-gray-800 dark:text-gray-200 hover:text-blue-600 dark:text-blue-400 font-medium block truncate" title="{{ $release->searchname }}">
resources/views/series/viewseries.blade.php
+14 -14
View File
@@ -1,7 +1,7 @@
@extends('layouts.main')
@section('content')
<div class="surface-panel rounded-xl shadow-sm">
<div class="series-detail-page surface-panel rounded-xl shadow-sm">
<!-- Breadcrumb -->
<div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700">
<nav aria-label="breadcrumb">
@@ -22,7 +22,7 @@
</div>
@else
<!-- Series Info Card -->
<div class="bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-xl shadow-sm mb-4">
<div class="series-main-card bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-xl shadow-sm mb-4">
<div class="px-4 py-3 bg-gray-50 dark:bg-gray-700 border-b border-gray-200 dark:border-gray-600">
<h5 class="text-xl font-bold text-gray-800 dark:text-white">
<i class="fa fa-tv mr-2 text-indigo-600 dark:text-indigo-400"></i>{{ $seriestitles ?? '' }}
@@ -35,31 +35,31 @@
<!-- Series Stats -->
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4 mb-6">
@if(!empty($show['started']))
<div class="bg-linear-to-br from-blue-50 to-blue-100 rounded-lg p-4 border border-blue-200">
<div class="series-stat-card bg-linear-to-br from-blue-50 to-blue-100 rounded-lg p-4 border border-blue-200">
<div class="text-xs font-semibold text-blue-600 dark:text-blue-400 uppercase mb-1">Series Started</div>
<div class="text-lg font-bold text-blue-900">
{{ \Carbon\Carbon::parse($show['started'])->format('M d, Y') }}
</div>
</div>
@endif
<div class="bg-linear-to-br from-purple-50 to-purple-100 rounded-lg p-4 border border-purple-200">
<div class="series-stat-card bg-linear-to-br from-purple-50 to-purple-100 rounded-lg p-4 border border-purple-200">
<div class="text-xs font-semibold text-purple-600 uppercase mb-1">Total Seasons Aired</div>
<div class="text-lg font-bold text-purple-900">{{ $totalSeasonsAired ?? 0 }}</div>
</div>
<div class="bg-linear-to-br from-pink-50 to-pink-100 rounded-lg p-4 border border-pink-200">
<div class="series-stat-card bg-linear-to-br from-pink-50 to-pink-100 rounded-lg p-4 border border-pink-200">
<div class="text-xs font-semibold text-pink-600 uppercase mb-1">Seasons Available</div>
<div class="text-lg font-bold text-pink-900">{{ $totalSeasonsAvailable ?? 0 }}</div>
</div>
<div class="bg-linear-to-br from-indigo-50 to-indigo-100 rounded-lg p-4 border border-indigo-200">
<div class="series-stat-card bg-linear-to-br from-indigo-50 to-indigo-100 rounded-lg p-4 border border-indigo-200">
<div class="text-xs font-semibold text-indigo-600 uppercase mb-1">Total Episodes Aired</div>
<div class="text-lg font-bold text-indigo-900">{{ $totalEpisodesAired ?? 0 }}</div>
</div>
<div class="bg-linear-to-br from-violet-50 to-violet-100 rounded-lg p-4 border border-violet-200">
<div class="series-stat-card bg-linear-to-br from-violet-50 to-violet-100 rounded-lg p-4 border border-violet-200">
<div class="text-xs font-semibold text-violet-600 uppercase mb-1">Episodes Available</div>
<div class="text-lg font-bold text-violet-900">{{ $episodeCount ?? 0 }}</div>
</div>
@if(!empty($firstEpisodeAired))
<div class="bg-linear-to-br from-teal-50 to-teal-100 rounded-lg p-4 border border-teal-200">
<div class="series-stat-card bg-linear-to-br from-teal-50 to-teal-100 rounded-lg p-4 border border-teal-200">
<div class="text-xs font-semibold text-teal-600 uppercase mb-1">First Episode Aired</div>
<div class="text-sm font-bold text-teal-900">
{{ $firstEpisodeAired->format('M d, Y') }}
@@ -67,7 +67,7 @@
</div>
@endif
@if(!empty($lastEpisodeAired))
<div class="bg-linear-to-br from-orange-50 to-orange-100 rounded-lg p-4 border border-orange-200">
<div class="series-stat-card bg-linear-to-br from-orange-50 to-orange-100 rounded-lg p-4 border border-orange-200">
<div class="text-xs font-semibold text-orange-600 uppercase mb-1">Last Episode Aired</div>
<div class="text-sm font-bold text-orange-900">
{{ $lastEpisodeAired->format('M d, Y') }}
@@ -75,7 +75,7 @@
</div>
@endif
@if(!empty($seriescountry))
<div class="bg-linear-to-br from-green-50 to-green-100 rounded-lg p-4 border border-green-200">
<div class="series-stat-card bg-linear-to-br from-green-50 to-green-100 rounded-lg p-4 border border-green-200">
<div class="text-xs font-semibold text-green-600 uppercase mb-1">Country</div>
<div class="text-lg font-bold text-green-900">{{ strtoupper($seriescountry) }}</div>
</div>
@@ -91,7 +91,7 @@
<div class="grid grid-cols-1 lg:grid-cols-4 gap-4">
@if(!empty($show['image']) && $show['image'] != 0)
<div class="lg:col-span-1">
<img class="w-full h-auto rounded-lg shadow-lg hover:shadow-xl transition-shadow duration-300"
<img class="series-detail-poster w-full h-auto rounded-lg"
alt="{{ $seriestitles ?? '' }} Poster"
src="{{ url('/covers/tvshows/' . $show['id'] . '.jpg') }}"/>
</div>
@@ -200,7 +200,7 @@
<!-- Episodes by Season - Tabbed Interface -->
@if(!empty($seasons))
<form id="nzb_multi_operations_form" method="get" x-data="releaseMultiOps">
<div class="bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-xl shadow-sm" x-data="seasonSwitcher">
<div class="series-episodes-card bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-xl shadow-sm" x-data="seasonSwitcher">
<div class="px-4 py-3 bg-gray-50 dark:bg-gray-700 border-b border-gray-200 dark:border-gray-600">
<div class="flex items-center justify-between">
<h5 class="text-lg font-semibold text-gray-800 dark:text-white">
@@ -259,7 +259,7 @@
</h6>
<div class="space-y-2">
@foreach($releases as $release)
<div class="flex items-center gap-3 bg-gray-50 dark:bg-gray-900 rounded p-3 hover:bg-gray-100">
<div class="series-episode-card flex items-center gap-3 bg-gray-50 dark:bg-gray-900 rounded-lg p-3 hover:bg-gray-100 dark:hover:bg-gray-800">
<div class="shrink-0">
<input type="checkbox" class="chkRelease rounded border-gray-300 dark:border-gray-600 text-blue-600 dark:text-blue-500 focus:ring-blue-500 dark:focus:ring-blue-400 dark:bg-gray-700" name="release[]" value="{{ $release->guid }}" @change="onCheckboxChange()">
</div>
@@ -331,7 +331,7 @@
</div>
@endif
@if(!empty($pagination['per_page']) && $pagination['per_page'] > 0 && ($pagination['total_pages'] ?? 1) > 1)
<div class="mt-6 flex items-center justify-between bg-gray-50 dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-lg p-4">
<div class="series-stat-card mt-6 flex items-center justify-between bg-gray-50 dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded-lg p-4">
<div class="text-sm text-gray-600 dark:text-gray-300">
Page {{ $pagination['current_page'] }} of {{ $pagination['total_pages'] }}
<span class="ml-2 text-xs text-gray-500">({{ number_format($pagination['total_rows']) }} total releases)</span>