85 lines
3.2 KiB
PHP
85 lines
3.2 KiB
PHP
@extends('layouts.nova')
|
|
|
|
@php
|
|
$featuredBreadcrumbs = collect([
|
|
(object) ['name' => 'Featured', 'url' => request()->path()],
|
|
(object) ['name' => $page_title ?? 'Featured Artworks', 'url' => request()->fullUrl()],
|
|
]);
|
|
|
|
$galleryArtworks = collect($artworks->items())->map(fn ($art) => [
|
|
'id' => $art->id,
|
|
'name' => $art->name ?? null,
|
|
'slug' => $art->slug ?? null,
|
|
'url' => $art->url ?? null,
|
|
'thumb' => $art->thumb_url ?? null,
|
|
'thumb_url' => $art->thumb_url ?? null,
|
|
'thumb_srcset' => $art->thumb_srcset ?? null,
|
|
'uname' => $art->uname ?? '',
|
|
'username' => $art->username ?? $art->uname ?? '',
|
|
'avatar_url' => $art->avatar_url ?? null,
|
|
'category_name' => $art->category_name ?? '',
|
|
'category_slug' => $art->category_slug ?? '',
|
|
'width' => $art->width ?? null,
|
|
'height' => $art->height ?? null,
|
|
])->values();
|
|
|
|
$galleryNextPageUrl = $artworks->nextPageUrl();
|
|
@endphp
|
|
|
|
@section('content')
|
|
<x-nova-page-header
|
|
section="Featured"
|
|
:title="$page_title ?? 'Featured Artworks'"
|
|
icon="fa-star"
|
|
:breadcrumbs="$featuredBreadcrumbs"
|
|
description="Browse staff-picked and community-highlighted artwork in the shared gallery feed."
|
|
headerClass="pb-6"
|
|
actionsClass="lg:pt-8"
|
|
>
|
|
<x-slot name="actions">
|
|
<div class="flex flex-wrap items-center gap-2 text-sm">
|
|
@foreach($artworkTypes as $k => $label)
|
|
<a
|
|
href="{{ url()->current() }}?type={{ (int) $k }}"
|
|
class="inline-flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-sm font-medium transition-colors {{ (int) $k === (int) $type ? 'bg-amber-500/20 text-amber-200 ring-1 ring-amber-400/30' : 'bg-white/[0.05] text-white/60 hover:bg-white/[0.1] hover:text-white' }}"
|
|
>
|
|
{{ $label }}
|
|
</a>
|
|
@endforeach
|
|
</div>
|
|
</x-slot>
|
|
</x-nova-page-header>
|
|
|
|
<section class="px-6 pt-8 md:px-10">
|
|
<div
|
|
data-react-masonry-gallery
|
|
data-artworks="{{ json_encode($galleryArtworks) }}"
|
|
data-gallery-type="featured"
|
|
@if ($galleryNextPageUrl) data-next-page-url="{{ $galleryNextPageUrl }}" @endif
|
|
data-limit="39"
|
|
class="min-h-32"
|
|
></div>
|
|
</section>
|
|
@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
|