klevze/SkinbaseNova
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
Gregor Klevže
2026-03-20 21:17:26 +01:00
parent 1a62fcb81d
commit 29c3ff8572
229 changed files with 13147 additions and 2577 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
resources/views/web/comments/monthly.blade.php
View File

@@ -2,7 +2,7 @@
@php
$headerBreadcrumbs = collect([
(object) ['name' => $page_title ?? 'Monthly Top Commentators', 'url' => route('legacy.monthly_commentators')],
(object) ['name' => $page_title ?? 'Monthly Top Commentators', 'url' => route('comments.monthly')],
]);
@endphp

2
resources/views/web/daily-uploads.blade.php
View File

@@ -2,7 +2,7 @@
@php
$headerBreadcrumbs = collect([
(object) ['name' => $page_title ?? 'Daily Uploads', 'url' => route('legacy.daily_uploads')],
(object) ['name' => $page_title ?? 'Daily Uploads', 'url' => route('uploads.daily')],
]);
@endphp

88
resources/views/web/downloads/today.blade.php
View File

@@ -2,8 +2,30 @@
@php
$headerBreadcrumbs = collect([
(object) ['name' => $page_title ?? 'Most Downloaded Today', 'url' => route('legacy.today_downloads')],
(object) ['name' => $page_title ?? 'Most Downloaded Today', 'url' => route('downloads.today')],
]);
$galleryArtworks = collect($artworks->items())->map(fn ($art) => [
'id' => $art->id,
'name' => $art->name ?? null,
'slug' => $art->slug ?? null,
'url' => isset($art->id) ? '/art/' . $art->id . '/' . ($art->slug ?: \Illuminate\Support\Str::slug($art->name ?? 'artwork')) : '#',
'thumb' => $art->thumb ?? $art->thumb_url ?? null,
'thumb_url' => $art->thumb_url ?? $art->thumb ?? null,
'thumb_srcset' => $art->thumb_srcset ?? null,
'uname' => $art->uname ?? '',
'username' => $art->username ?? '',
'avatar_url' => $art->avatar_url ?? null,
'category_name' => $art->category_name ?? '',
'category_slug' => $art->category_slug ?? '',
'width' => $art->width ?? null,
'height' => $art->height ?? null,
'metric_badge' => ((int) ($art->num_downloads ?? 0)) > 0 ? [
'label' => number_format((int) $art->num_downloads),
'iconClass' => 'fa-solid fa-download text-[10px]',
'className' => 'bg-emerald-500/14 text-emerald-200 ring-emerald-400/30',
] : null,
])->values();
$galleryNextPageUrl = $artworks->nextPageUrl();
@endphp
@section('content')
@@ -26,41 +48,14 @@
{{-- ── Artwork grid ── --}}
<div class="px-6 pt-8 pb-16 md:px-10">
@if ($artworks && $artworks->isNotEmpty())
<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 xl:grid-cols-5 gap-4 md:gap-5">
@foreach ($artworks as $art)
@php
$card = (object)[
'id' => $art->id ?? null,
'name' => $art->name ?? 'Artwork',
'thumb' => $art->thumb ?? null,
'thumb_srcset' => $art->thumb_srcset ?? null,
'uname' => $art->uname ?? '',
'category_name' => $art->category_name ?? '',
'slug' => $art->slug ?? \Illuminate\Support\Str::slug($art->name ?? 'artwork'),
];
$downloads = (int) ($art->num_downloads ?? 0);
@endphp
{{-- Wrap card to overlay download badge --}}
<div class="relative">
<x-artwork-card :art="$card" />
@if ($downloads > 0)
<div class="absolute top-2 left-2 z-40 pointer-events-none">
<span class="inline-flex items-center gap-1 rounded-md px-1.5 py-0.5 text-[10px] font-semibold bg-black/60 text-emerald-300 backdrop-blur-sm ring-1 ring-emerald-500/30">
<svg class="w-3 h-3" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5">
<path stroke-linecap="round" stroke-linejoin="round" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"/>
</svg>
{{ number_format($downloads) }}
</span>
</div>
@endif
</div>
@endforeach
</div>
<div class="mt-10 flex justify-center">
{{ $artworks->withQueryString()->links() }}
</div>
<div
data-react-masonry-gallery
data-artworks='@json($galleryArtworks)'
data-gallery-type="today-downloads"
@if ($galleryNextPageUrl) data-next-page-url="{{ $galleryNextPageUrl }}" @endif
data-limit="{{ $artworks->perPage() }}"
class="min-h-32"
></div>
@else
<div class="rounded-xl border border-white/[0.06] bg-white/[0.02] px-8 py-12 text-center">
<svg class="mx-auto mb-3 w-10 h-10 text-white/20" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
@@ -73,3 +68,24 @@
</div>
@endsection
@push('styles')
<style>
@media (min-width: 1024px) {
[data-nova-gallery] [data-gallery-grid] { grid-template-columns: repeat(5, minmax(0, 1fr)); }
[data-nova-gallery].is-enhanced [data-gallery-grid] { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (min-width: 1600px) {
[data-nova-gallery] [data-gallery-grid] { grid-template-columns: repeat(6, minmax(0, 1fr)); }
[data-nova-gallery].is-enhanced [data-gallery-grid] { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (min-width: 2600px) {
[data-nova-gallery] [data-gallery-grid] { grid-template-columns: repeat(7, minmax(0, 1fr)); }
[data-nova-gallery].is-enhanced [data-gallery-grid] { grid-template-columns: repeat(7, minmax(0, 1fr)); }
}
</style>
@endpush
@push('scripts')
@vite('resources/js/entry-masonry-gallery.jsx')
@endpush

55
resources/views/web/gallery.blade.php
View File

@@ -1,55 +0,0 @@
@extends('layouts.nova')
@section('content')
<div class="container-fluid legacy-page">
<div class="effect2 page-header-wrap">
<header class="page-heading">
<h1 class="page-header">Gallery: {{ $user->uname ?? $user->name ?? 'User' }}</h1>
<p>{{ $user->name ?? '' }}</p>
</header>
</div>
<div class="row">
<div class="col-md-8">
<div class="panel panel-default effect2">
<div class="panel-heading"><strong>User Gallery</strong></div>
<div class="panel-body">
<div class="gallery-grid grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-5">
@foreach($artworks as $art)
<div class="thumb-card effect2">
<x-artwork-card :art="$art" />
</div>
@endforeach
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="panel panel-default effect2">
<div class="panel-heading"><strong>User</strong></div>
<div class="panel-body">
<img src="{{ \App\Support\AvatarUrl::forUser((int) ($user->user_id ?? $user->id), null, 128) }}" class="img-responsive" style="max-width:120px;" alt="{{ $user->uname ?? $user->name }}">
<h3>{{ $user->uname ?? $user->name }}</h3>
<p>{{ $user->about_me ?? '' }}</p>
</div>
</div>
</div>
</div>
{{-- Simple pagination controls like legacy site --}}
@php
$pages = (int) ceil($total / $hits);
@endphp
@if($pages > 1)
<nav>
<ul class="pagination">
@for($i=1;$i<=$pages;$i++)
<li class="{{ $i == $page ? 'active' : '' }}"><a href="{{ url('/gallery/'.$user->id.'?page='.$i) }}">{{ $i }}</a></li>
@endfor
</ul>
</nav>
@endif
</div>
@endsection

52
resources/views/web/home/uploads.blade.php
View File

@@ -10,6 +10,29 @@
$seoNext = (isset($latestUploads) && method_exists($latestUploads, 'hasMorePages') && $latestUploads->hasMorePages())
? $seoBase . '?page=' . ($seoPage + 1)
: null;
$homeUploadsItems = collect(method_exists($latestUploads ?? null, 'items') ? $latestUploads->items() : ($latestUploads ?? []));
$homeGalleryArtworks = $homeUploadsItems->map(fn ($upload) => [
'id' => $upload->id ?? null,
'name' => $upload->name ?? $upload->title ?? null,
'slug' => $upload->slug ?? \Illuminate\Support\Str::slug($upload->name ?? $upload->title ?? 'artwork'),
'url' => $upload->url ?? ((isset($upload->id) && $upload->id) ? '/art/' . $upload->id . '/' . ($upload->slug ?? \Illuminate\Support\Str::slug($upload->name ?? $upload->title ?? 'artwork')) : '#'),
'thumb' => $upload->thumb ?? $upload->thumb_url ?? null,
'thumb_url' => $upload->thumb_url ?? $upload->thumb ?? null,
'thumb_srcset' => $upload->thumb_srcset ?? null,
'uname' => $upload->uname ?? $upload->author_name ?? '',
'username' => $upload->username ?? $upload->uname ?? '',
'avatar_url' => $upload->avatar_url ?? null,
'content_type_name' => $upload->content_type_name ?? '',
'content_type_slug' => $upload->content_type_slug ?? '',
'category_name' => $upload->category_name ?? '',
'category_slug' => $upload->category_slug ?? '',
'width' => $upload->width ?? null,
'height' => $upload->height ?? null,
'published_at' => !empty($upload->published_at)
? (method_exists($upload->published_at, 'toIsoString') ? $upload->published_at->toIsoString() : (string) $upload->published_at)
: null,
]);
$homeGalleryNextPageUrl = method_exists($latestUploads ?? null, 'nextPageUrl') ? $latestUploads->nextPageUrl() : null;
@endphp
@push('head')
@@ -19,25 +42,15 @@
@endpush
{{-- Latest uploads grid — use same Nova gallery layout as /browse --}}
<section class="px-6 pb-10 pt-6 md:px-10" data-nova-gallery data-gallery-type="home-uploads">
<div class="{{ ($gridV2 ?? false) ? 'gallery' : 'grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-6' }}" data-gallery-grid>
@forelse($latestUploads as $upload)
<x-artwork-card :art="$upload" />
@empty
<div class="panel panel-default effect2">
<div class="panel-heading"><strong>No uploads yet</strong></div>
<div class="panel-body text-neutral-400">No recent uploads to show.</div>
</div>
@endforelse
</div>
<div class="flex justify-center mt-10" data-gallery-pagination>
{{-- no pagination for home grid; kept for parity with browse layout --}}
</div>
<div class="hidden" data-gallery-skeleton-template aria-hidden="true">
<x-skeleton.artwork-card />
</div>
<div class="hidden mt-8" data-gallery-skeleton></div>
<section class="px-6 pb-10 pt-6 md:px-10">
<div
data-react-masonry-gallery
data-artworks='@json($homeGalleryArtworks)'
data-gallery-type="home-uploads"
@if ($homeGalleryNextPageUrl) data-next-page-url="{{ $homeGalleryNextPageUrl }}" @endif
data-limit="{{ method_exists($latestUploads ?? null, 'perPage') ? $latestUploads->perPage() : $homeGalleryArtworks->count() }}"
class="min-h-32"
></div>
</section>
@push('styles')
@@ -66,5 +79,6 @@
@endpush
@push('scripts')
@vite('resources/js/entry-masonry-gallery.jsx')
@endpush

91
resources/views/web/members/photos.blade.php
View File

@@ -1,43 +1,64 @@
@extends('layouts.nova')
@php
$memberPhotoBreadcrumbs = collect([
(object) ['name' => 'Members', 'url' => route('creators.top')],
(object) ['name' => $page_title ?? 'Member Photos', 'url' => route('members.photos')],
]);
$memberPhotoItems = collect(method_exists($artworks ?? null, 'items') ? $artworks->items() : ($artworks ?? []));
$memberPhotoGallery = $memberPhotoItems->map(fn ($art) => [
'id' => $art->id ?? null,
'name' => $art->name ?? $art->title ?? 'Artwork',
'slug' => $art->slug ?? \Illuminate\Support\Str::slug($art->name ?? $art->title ?? 'artwork'),
'url' => $art->url ?? ((isset($art->id) && $art->id) ? '/art/' . $art->id . '/' . ($art->slug ?? \Illuminate\Support\Str::slug($art->name ?? $art->title ?? 'artwork')) : '#'),
'thumb' => $art->thumb ?? $art->thumb_url ?? null,
'thumb_url' => $art->thumb_url ?? $art->thumb ?? null,
'thumb_srcset' => $art->thumb_srcset ?? null,
'uname' => $art->uname ?? $art->author ?? '',
'username' => $art->username ?? $art->uname ?? '',
'avatar_url' => $art->avatar_url ?? null,
'content_type_name' => $art->content_type_name ?? '',
'content_type_slug' => $art->content_type_slug ?? '',
'category_name' => $art->category_name ?? '',
'category_slug' => $art->category_slug ?? '',
'width' => $art->width ?? null,
'height' => $art->height ?? null,
'published_at' => !empty($art->published_at)
? (method_exists($art->published_at, 'toIsoString') ? $art->published_at->toIsoString() : (string) $art->published_at)
: null,
]);
$memberPhotosNextPageUrl = method_exists($artworks ?? null, 'nextPageUrl') ? $artworks->nextPageUrl() : null;
@endphp
@section('content')
{{-- ── Hero header ── --}}
<div class="px-6 pt-10 pb-6 md:px-10">
<div>
<p class="text-xs font-semibold uppercase tracking-widest text-white/30 mb-1">Members</p>
<h1 class="text-3xl font-bold text-white leading-tight">{{ $page_title ?? 'Member Photos' }}</h1>
<p class="mt-1 text-sm text-white/50">Artwork submitted by the Skinbase community.</p>
</div>
</div>
<x-nova-page-header
section="Members"
:title="$page_title ?? 'Member Photos'"
icon="fa-images"
:breadcrumbs="$memberPhotoBreadcrumbs"
description="Artwork submitted by the Skinbase community, presented in the shared Nova gallery feed."
headerClass="pb-6"
>
<x-slot name="actions">
<span class="inline-flex items-center gap-1.5 rounded-full px-3 py-1 text-xs font-medium bg-sky-500/10 text-sky-200 ring-1 ring-sky-400/25">
<span class="w-1.5 h-1.5 rounded-full bg-sky-300"></span>
Community uploads
</span>
</x-slot>
</x-nova-page-header>
{{-- ── Artwork grid ── --}}
<div class="px-6 pb-16 md:px-10">
@php $items = is_object($artworks) && method_exists($artworks, 'toArray') ? $artworks : collect($artworks ?? []); @endphp
@if (!empty($artworks) && (is_countable($artworks) ? count($artworks) > 0 : true))
<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 xl:grid-cols-5 gap-4 md:gap-5">
@foreach ($artworks as $art)
@php
$card = (object)[
'id' => $art->id ?? null,
'name' => $art->name ?? $art->title ?? 'Artwork',
'thumb' => $art->thumb ?? $art->thumb_url ?? null,
'thumb_srcset' => $art->thumb_srcset ?? null,
'uname' => $art->uname ?? $art->author ?? '',
'category_name' => $art->category_name ?? '',
'slug' => $art->slug ?? \Illuminate\Support\Str::slug($art->name ?? 'artwork'),
];
@endphp
<x-artwork-card :art="$card" />
@endforeach
</div>
@if (is_object($artworks) && method_exists($artworks, 'links'))
<div class="mt-10 flex justify-center">
{{ $artworks->withQueryString()->links() }}
</div>
@endif
@if ($memberPhotoGallery->isNotEmpty())
<div
data-react-masonry-gallery
data-artworks='@json($memberPhotoGallery)'
data-gallery-type="member-photos"
@if ($memberPhotosNextPageUrl) data-next-page-url="{{ $memberPhotosNextPageUrl }}" @endif
data-limit="{{ method_exists($artworks ?? null, 'perPage') ? $artworks->perPage() : $memberPhotoGallery->count() }}"
class="min-h-32"
></div>
@else
<div class="rounded-xl border border-white/[0.06] bg-white/[0.02] px-8 py-12 text-center">
<p class="text-white/40 text-sm">No artworks found.</p>
@@ -46,3 +67,7 @@
</div>
@endsection
@push('scripts')
@vite('resources/js/entry-masonry-gallery.jsx')
@endpush

6
resources/views/web/stories/editor.blade.php
View File

@@ -2,7 +2,7 @@
@php
$hero_title = $mode === 'create' ? 'Write Story' : 'Edit Story';
$hero_description = 'Medium-style editor with autosave, slash commands, artwork embeds, and publishing workflow.';
$hero_description = 'A focused writing studio with autosave, embeds, live preview, and a cleaner publish workflow.';
@endphp
@section('page-content')
@@ -49,7 +49,7 @@
];
@endphp
<div class="mx-auto max-w-3xl" id="story-editor-react-root"
<div class="mx-auto max-w-7xl" id="story-editor-react-root"
data-mode="{{ $mode }}"
data-story='@json($storyPayload)'
data-story-types='@json($storyTypes)'
@@ -58,4 +58,4 @@
Loading editor...
</div>
</div>
@endsection
@endsection

2
resources/views/web/stories/preview.blade.php
View File

@@ -23,7 +23,7 @@
<p class="mt-3 text-gray-300">{{ $story->excerpt }}</p>
@endif
<div class="prose prose-invert mt-6 max-w-none prose-a:text-sky-300 prose-pre:bg-gray-900">
<div class="story-prose prose prose-invert mt-6 max-w-none prose-a:text-sky-300 prose-pre:overflow-x-auto prose-pre:rounded-2xl prose-pre:border prose-pre:border-slate-700 prose-pre:bg-slate-950 prose-pre:px-8 prose-pre:py-6 prose-pre:text-slate-100 prose-pre:shadow-[0_24px_70px_rgba(2,6,23,0.45)] prose-pre:ring-1 prose-pre:ring-sky-500/10 prose-pre:font-mono prose-pre:text-[0.95rem] prose-pre:leading-8 prose-code:text-amber-200 prose-code:bg-white/[0.08] prose-code:px-1.5 prose-code:py-0.5 prose-code:rounded-md prose-code:before:content-none prose-code:after:content-none prose-blockquote:border-l-4 prose-blockquote:border-sky-400/55 prose-blockquote:bg-sky-400/[0.06] prose-blockquote:px-5 prose-blockquote:py-3 prose-blockquote:rounded-r-xl prose-blockquote:text-white/82 prose-blockquote:italic prose-pre:prose-code:bg-transparent prose-pre:prose-code:p-0 prose-pre:prose-code:text-slate-100 prose-pre:prose-code:rounded-none [&_ul]:list-disc [&_ul]:pl-6 [&_ul]:space-y-2 [&_ol]:list-decimal [&_ol]:pl-6 [&_ol]:space-y-2 [&_li]:text-white/85">
{!! $safeContent !!}
</div>
</div>

51
resources/views/web/stories/show.blade.php
View File

@@ -1,17 +1,21 @@
@extends('layouts.nova.content-layout')
@php
$hero_title = $story->title;
$hero_description = $story->excerpt ?: \Illuminate\Support\Str::limit(strip_tags((string) $story->content), 160);
$storySummary = $story->excerpt ?: \Illuminate\Support\Str::limit(trim(strip_tags($safeContent)), 160);
@endphp
@push('head')
@php
$storyUrl = $story->canonical_url ?: route('stories.show', ['slug' => $story->slug]);
$creatorName = $story->creator?->display_name ?: $story->creator?->username ?: 'Unknown creator';
$metaDescription = $story->meta_description ?: $hero_description;
$metaDescription = $story->meta_description ?: $storySummary;
$metaTitle = $story->meta_title ?: $story->title;
$ogImage = $story->og_image ?: $story->cover_url;
$creatorFollowProps = $story->creator ? [
'username' => $story->creator->username,
'following' => (bool) ($storySocialProps['state']['is_following_creator'] ?? false),
'followers_count' => (int) ($storySocialProps['creator']['followers_count'] ?? 0),
] : null;
@endphp
<meta property="og:type" content="article" />
<meta property="og:title" content="{{ $metaTitle }}" />
@@ -44,6 +48,10 @@
</script>
@endpush
@section('page-hero')
<div class="hidden" aria-hidden="true"></div>
@endsection
@section('page-content')
<div class="mx-auto grid max-w-7xl gap-8 lg:grid-cols-12">
<article class="lg:col-span-8">
@@ -65,41 +73,13 @@
<p class="mt-3 text-gray-300">{{ $story->excerpt }}</p>
@endif
<div class="mt-6 prose prose-invert max-w-none prose-a:text-sky-300 prose-pre:bg-gray-900">
<div class="story-prose mt-6 prose prose-invert max-w-none prose-a:text-sky-300 prose-pre:overflow-x-auto prose-pre:rounded-2xl prose-pre:border prose-pre:border-slate-700 prose-pre:bg-slate-950 prose-pre:px-8 prose-pre:py-6 prose-pre:text-slate-100 prose-pre:shadow-[0_24px_70px_rgba(2,6,23,0.45)] prose-pre:ring-1 prose-pre:ring-sky-500/10 prose-pre:font-mono prose-pre:text-[0.95rem] prose-pre:leading-8 prose-code:text-amber-200 prose-code:bg-white/[0.08] prose-code:px-1.5 prose-code:py-0.5 prose-code:rounded-md prose-code:before:content-none prose-code:after:content-none prose-blockquote:border-l-4 prose-blockquote:border-sky-400/55 prose-blockquote:bg-sky-400/[0.06] prose-blockquote:px-5 prose-blockquote:py-3 prose-blockquote:rounded-r-xl prose-blockquote:text-white/82 prose-blockquote:italic prose-pre:prose-code:bg-transparent prose-pre:prose-code:p-0 prose-pre:prose-code:text-slate-100 prose-pre:prose-code:rounded-none [&_ul]:list-disc [&_ul]:pl-6 [&_ul]:space-y-2 [&_ol]:list-decimal [&_ol]:pl-6 [&_ol]:space-y-2 [&_li]:text-white/85">
{!! $safeContent !!}
</div>
</div>
</div>
<section class="mt-8 rounded-xl border border-gray-700 bg-gray-800/60 p-6">
<h2 class="mb-5 text-xl font-semibold tracking-tight text-white">Discussion</h2>
@if($comments->isEmpty())
<p class="text-sm text-gray-400">No comments yet.</p>
@else
<div class="space-y-4">
@foreach($comments as $comment)
<div class="rounded-lg border border-gray-700 bg-gray-900/60 p-4">
<div class="mb-2 text-xs text-gray-400">
{{ $comment->author_username ?? 'User' }}
<span class="mx-1">•</span>
{{ optional($comment->created_at)->diffForHumans() }}
</div>
<p class="text-sm leading-relaxed text-gray-200">{{ $comment->body }}</p>
</div>
@endforeach
</div>
@endif
@auth
@if($story->creator)
<form method="POST" action="{{ url('/@' . $story->creator->username . '/comment') }}" class="mt-5 space-y-3">
@csrf
<textarea name="body" rows="3" class="w-full rounded-lg border border-gray-700 bg-gray-900 px-3 py-2 text-sm text-white" placeholder="Add a comment for this creator"></textarea>
<button class="rounded-lg border border-sky-500/40 bg-sky-500/10 px-4 py-2 text-sm text-sky-200 transition hover:scale-[1.01]">Post comment</button>
</form>
@endif
@endauth
</section>
<section class="mt-8" id="story-social-root" data-props='@json($storySocialProps)'></section>
</article>
<aside class="space-y-8 lg:col-span-4">
@@ -109,10 +89,7 @@
<span>{{ $story->creator?->display_name ?: $story->creator?->username }}</span>
</a>
@if($story->creator)
<form method="POST" action="{{ url('/@' . $story->creator->username . '/follow') }}" class="mt-4">
@csrf
<button class="w-full rounded-lg border border-sky-500/40 bg-sky-500/10 px-3 py-2 text-sm text-sky-200 transition hover:scale-[1.01]">Follow Creator</button>
</form>
<div class="mt-4" id="story-creator-follow-root" data-props='@json($creatorFollowProps)'></div>
@endif
</div>

218
resources/views/web/uploads/latest.blade.php
View File

@@ -1,55 +1,185 @@
@extends('layouts.nova')
@php
$latestBreadcrumbs = collect([
(object) ['name' => 'Uploads', 'url' => route('uploads.latest')],
(object) ['name' => $page_title ?? 'Latest Artworks', 'url' => route('uploads.latest')],
]);
$cursorStateLabel = request()->filled('cursor') ? 'Browsing archive' : 'Latest slice';
$cursorStateCopy = request()->filled('cursor')
? 'You are viewing an older slice of the cursor-based feed.'
: 'You are viewing the newest public uploads first.';
$galleryArtworks = collect($artworks->items())->map(fn ($art) => [
'id' => $art->id,
'name' => $art->name ?? null,
'thumb' => $art->thumb_url ?? $art->thumb ?? null,
'thumb_url' => $art->thumb_url ?? $art->thumb ?? null,
'thumb_srcset' => $art->thumb_srcset ?? null,
'uname' => $art->uname ?? '',
'username' => $art->username ?? '',
'avatar_url' => $art->avatar_url ?? null,
'content_type_name' => $art->content_type_name ?? '',
'content_type_slug' => $art->content_type_slug ?? '',
'category_name' => $art->category_name ?? '',
'category_slug' => $art->category_slug ?? '',
'slug' => $art->slug ?? '',
'width' => $art->width ?? null,
'height' => $art->height ?? null,
'published_at' => optional($art->published_at)?->toIsoString() ?? null,
'url' => isset($art->id) ? '/art/' . $art->id . '/' . ($art->slug ?: \Illuminate\Support\Str::slug($art->name ?? 'artwork')) : '#',
])->values();
$galleryNextPageUrl = method_exists($artworks, 'nextPageUrl') ? $artworks->nextPageUrl() : null;
@endphp
@section('content')
{{-- ── Hero header ── --}}
<div class="px-6 pt-10 pb-6 md:px-10">
<div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
<div>
<p class="text-xs font-semibold uppercase tracking-widest text-white/30 mb-1">Skinbase</p>
<h1 class="text-3xl font-bold text-white leading-tight">Latest Artworks</h1>
<p class="mt-1 text-sm text-white/50">Recently uploaded Skins, Photography and Wallpapers.</p>
</div>
<div class="flex items-center gap-3">
<a href="{{ route('uploads.daily') }}"
class="inline-flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium border border-white/[0.08] bg-white/[0.04] text-white/70 hover:bg-white/[0.08] hover:text-white transition-colors">
<svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.75">
<path stroke-linecap="round" stroke-linejoin="round" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/>
</svg>
<x-nova-page-header
section="Uploads"
:title="$page_title ?? 'Latest Artworks'"
icon="fa-sparkles"
:breadcrumbs="$latestBreadcrumbs"
description="Fresh public uploads across skins, photography, wallpapers, and the rest of the Skinbase catalog."
headerClass="pb-6"
actionsClass="lg:pt-8"
>
<x-slot name="actions">
<div class="flex flex-wrap items-center gap-3">
<a
href="{{ route('uploads.daily') }}"
class="inline-flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium border border-white/[0.08] bg-white/[0.04] text-white/70 hover:bg-white/[0.08] hover:text-white transition-colors"
>
<i class="fa-solid fa-calendar-day text-sky-300"></i>
Daily Uploads
</a>
<a
href="{{ route('discover.fresh') }}"
class="inline-flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium border border-sky-400/20 bg-sky-400/10 text-sky-100 hover:bg-sky-400/15 transition-colors"
>
<i class="fa-solid fa-compass text-sky-300"></i>
Discover Fresh
</a>
</div>
</x-slot>
</x-nova-page-header>
<section class="px-6 pt-8 md:px-10">
<div class="grid gap-4 lg:grid-cols-[minmax(0,1fr)_320px]">
<div class="overflow-hidden rounded-[1.5rem] border border-white/[0.08] bg-[radial-gradient(circle_at_top_left,_rgba(56,189,248,0.16),_transparent_34%),linear-gradient(135deg,rgba(11,17,27,0.96),rgba(10,16,24,0.88))] p-5 shadow-[0_20px_70px_rgba(3,7,18,0.24)] md:p-6">
<div class="flex flex-wrap items-center gap-3 text-sm text-white/58">
<span class="inline-flex items-center gap-2 rounded-full border border-sky-400/20 bg-sky-400/10 px-3 py-1 text-[11px] font-semibold uppercase tracking-[0.24em] text-sky-200">
<span class="h-2 w-2 rounded-full bg-sky-300"></span>
Live feed
</span>
<span class="inline-flex items-center gap-2 rounded-full border border-white/10 bg-white/[0.05] px-3 py-1 text-xs font-medium text-white/60">
Ordered by newest first
</span>
</div>
<div class="mt-5 grid gap-4 md:grid-cols-3">
<div class="rounded-2xl border border-white/10 bg-white/[0.05] p-4 backdrop-blur-sm">
<p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-white/40">This page</p>
<p class="mt-3 text-3xl font-semibold text-white">{{ number_format($artworks->count()) }}</p>
<p class="mt-2 text-sm text-white/45">Artworks loaded in the current slice.</p>
</div>
<div class="rounded-2xl border border-white/10 bg-white/[0.05] p-4 backdrop-blur-sm">
<p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-white/40">Position</p>
<p class="mt-3 text-3xl font-semibold text-white">{{ $cursorStateLabel }}</p>
<p class="mt-2 text-sm text-white/45">{{ $cursorStateCopy }}</p>
</div>
<div class="rounded-2xl border border-white/10 bg-white/[0.05] p-4 backdrop-blur-sm">
<p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-white/40">Per page</p>
<p class="mt-3 text-3xl font-semibold text-white">{{ number_format($artworks->perPage()) }}</p>
<p class="mt-2 text-sm text-white/45">Balanced for a fast modern gallery load.</p>
</div>
</div>
</div>
<aside class="grid gap-4 sm:grid-cols-2 lg:grid-cols-1">
<div class="rounded-[1.5rem] border border-white/[0.08] bg-white/[0.03] p-5 backdrop-blur-sm">
<p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-white/38">Gallery mode</p>
<h2 class="mt-3 text-lg font-semibold text-white">Nova Gallery</h2>
<p class="mt-2 text-sm leading-6 text-white/52">A denser card wall with the same Skinbase artwork cards used across discover and browse surfaces.</p>
</div>
<div class="rounded-[1.5rem] border border-white/[0.08] bg-white/[0.03] p-5 backdrop-blur-sm">
<p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-white/38">Content mix</p>
<h2 class="mt-3 text-lg font-semibold text-white">All public uploads</h2>
<p class="mt-2 text-sm leading-6 text-white/52">Skins, photography, wallpapers, and everything else released publicly, sorted strictly by recency.</p>
</div>
</aside>
</div>
</div>
</section>
{{-- ── Artwork grid ── --}}
<div class="px-6 pb-16 md:px-10">
@if ($artworks && $artworks->isNotEmpty())
<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 xl:grid-cols-5 gap-4 md:gap-5">
@foreach ($artworks as $art)
@php
$card = (object)[
'id' => $art->id,
'name' => $art->name,
'thumb' => $art->thumb_url ?? $art->thumb ?? null,
'thumb_srcset' => $art->thumb_srcset ?? null,
'uname' => $art->uname ?? '',
'category_name' => $art->category_name ?? '',
];
@endphp
<x-artwork-card :art="$card" />
@endforeach
</div>
{{-- Pagination --}}
<div class="mt-10 flex justify-center">
{{ $artworks->withQueryString()->links() }}
</div>
@else
<div class="rounded-xl border border-white/[0.06] bg-white/[0.02] px-8 py-12 text-center">
<p class="text-white/40 text-sm">No artworks found.</p>
</div>
@endif
</div>
<section class="px-6 pb-16 pt-8 md:px-10">
<div
data-react-masonry-gallery
data-artworks='@json($galleryArtworks)'
data-gallery-type="latest-uploads"
@if ($galleryNextPageUrl) data-next-page-url="{{ $galleryNextPageUrl }}" @endif
data-limit="{{ $artworks->perPage() }}"
class="min-h-32"
></div>
</section>
@endsection
@push('styles')
<style>
[data-nova-gallery].is-enhanced [data-gallery-grid] {
display: grid;
grid-template-columns: repeat(1, minmax(0, 1fr));
grid-auto-rows: 8px;
gap: 1rem;
}
@media (min-width: 768px) {
[data-nova-gallery].is-enhanced [data-gallery-grid] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
[data-nova-gallery] [data-gallery-grid] { grid-template-columns: repeat(5, minmax(0, 1fr)); }
[data-nova-gallery].is-enhanced [data-gallery-grid] { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (min-width: 1600px) {
[data-nova-gallery] [data-gallery-grid] { grid-template-columns: repeat(6, minmax(0, 1fr)); }
[data-nova-gallery].is-enhanced [data-gallery-grid] { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (min-width: 2600px) {
[data-nova-gallery] [data-gallery-grid] { grid-template-columns: repeat(7, minmax(0, 1fr)); }
[data-nova-gallery].is-enhanced [data-gallery-grid] { grid-template-columns: repeat(7, minmax(0, 1fr)); }
}
[data-nova-gallery].is-enhanced [data-gallery-grid] > .nova-card { margin: 0 !important; }
[data-nova-gallery].is-enhanced [data-gallery-pagination] {
display: flex;
justify-content: center;
align-items: center;
gap: 0.5rem;
margin-top: 1.5rem;
}
[data-nova-gallery].is-enhanced [data-gallery-pagination] ul {
display: inline-flex;
gap: 0.25rem;
align-items: center;
padding: 0;
margin: 0;
list-style: none;
}
[data-nova-gallery].is-enhanced [data-gallery-pagination] li a,
[data-nova-gallery].is-enhanced [data-gallery-pagination] li span {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 2.25rem;
height: 2.25rem;
border-radius: 0.75rem;
padding: 0 0.75rem;
background: rgba(255,255,255,0.03);
color: #e6eef8;
border: 1px solid rgba(255,255,255,0.04);
text-decoration: none;
font-size: 0.875rem;
}
[data-gallery-skeleton].is-loading { display: grid !important; grid-template-columns: inherit; gap: 1rem; }
</style>
@endpush
@push('scripts')
@vite('resources/js/entry-masonry-gallery.jsx')
@endpush