update
This commit is contained in:
@@ -1,182 +0,0 @@
|
||||
<nav class="navbar yamm navbar-skinbase navbar-fixed-top" role="navigation">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#mainToolbarNavCollapse">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a href="/" class="navbar-brand sb_toolbarLogo" title="SkinBase">SkinBase</a>
|
||||
</div>
|
||||
|
||||
<div class="collapse navbar-collapse" id="mainToolbarNavCollapse">
|
||||
<form class="hidden-xs navbar-form navbar-left" action="/search" method="get" id="search_box">
|
||||
<input type="text" name="q" value="{{ request('q') }}">
|
||||
<input type="hidden" name="group" value="all">
|
||||
<button type="submit"><i class="fa fa-search fa-fw"></i></button>
|
||||
</form>
|
||||
|
||||
<ul class="nav navbar-nav">
|
||||
<li class="dropdown yamm-fw">
|
||||
<a href="#" class="dropdown-toggle c-white" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
|
||||
<i class="fa fa-cloud"></i> Browse <i class="fa fa-angle-down"></i>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li>
|
||||
<div class="yamm-content">
|
||||
<div class="row">
|
||||
<div class="col-xs-6 col-sm-3 col-md-3 menu_box">
|
||||
<i class="fa fa-archive fa-fw"></i> Browse Artworks:<br>
|
||||
<div class="divider"></div>
|
||||
<ul class="submenu">
|
||||
<li><a href="/browse"><i class="fa fa-cloud fa-fw"></i> All Artworks</a></li>
|
||||
<li><a href="/photography"><i class="fa fa-photo fa-fw"></i> Photography</a></li>
|
||||
<li><a href="/wallpapers"><i class="fa fa-photo fa-fw"></i> Wallpapers</a></li>
|
||||
<li><a href="/skins"><i class="fa fa-photo fa-fw"></i> Skins</a></li>
|
||||
<li><a href="/other"><i class="fa fa-photo fa-fw"></i> Other</a></li>
|
||||
<li><a href="/featured-artworks"><i class="fa fa-trophy fa-fw"></i> Featured</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<i class="fa fa-eye fa-fw"></i> View:<br>
|
||||
<div class="divider"></div>
|
||||
<ul class="submenu">
|
||||
<li><a href="/forum"><i class="fa fa-comments fa-fw"></i> Forum</a></li>
|
||||
<li><a href="{{ route('community.chat') }}"><i class="fa fa-comments fa-fw"></i> Chat</a></li>
|
||||
<li><a href="/community/activity"><i class="fa fa-wave-square fa-fw"></i> Activity Feed</a></li>
|
||||
<li><a href="/browse-categories"><i class="fa fa-cloud fa-fw"></i> Categories</a></li>
|
||||
<li><a href="/latest-artworks"><i class="fa fa-trophy fa-fw"></i> Latest Uploads</a></li>
|
||||
<li><a href="/daily-uploads"><i class="fa fa-trophy fa-fw"></i> Recent Uploads</a></li>
|
||||
<li><a href="/today-in-history"><i class="fa fa-trophy fa-fw"></i> Today in History</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<i class="fa fa-users fa-fw"></i> Authors:<br>
|
||||
<div class="divider"></div>
|
||||
<ul class="submenu">
|
||||
<li><a href="/interviews"><i class="fa fa-users fa-fw"></i> Interviews</a></li>
|
||||
<li><a href="/Members/MembersPhotos/545"><i class="fa fa-users fa-fw"></i> Members Photos</a></li>
|
||||
<li><a href="/top-authors"><i class="fa fa-users fa-fw"></i> Top Authors</a></li>
|
||||
<li><a href="/community/activity"><i class="fa fa-wave-square fa-fw"></i> Activity Feed</a></li>
|
||||
<li><a href="/monthly-commentators"><i class="fa fa-bar-chart fa-fw"></i> Monthly Top Comments</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<i class="fa fa-bar-chart fa-fw"></i> Statistics:<br>
|
||||
<div class="divider"></div>
|
||||
<ul class="submenu">
|
||||
<li><a href="/today-downloads"><i class="fa fa-bar-chart fa-fw"></i> Today Downloads</a></li>
|
||||
<li><a href="/top-favourites"><i class="fa fa-bar-chart fa-fw"></i> Top Favourites</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle c-white" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
|
||||
<i class="fa fa-list-ul"></i> Categories <i class="fa fa-angle-down"></i>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="/photography"><i class="fa fa-camera"></i> Photography</a></li>
|
||||
<li><a href="/wallpapers"><i class="fa fa-desktop"></i> Wallpapers</a></li>
|
||||
<li><a href="/skins"><i class="fa fa-eye"></i> Skins</a></li>
|
||||
<li><a href="/other"><i class="fa fa-file-o"></i> Others</a></li>
|
||||
<li role="separator" class="divider"></li>
|
||||
<li><a href="/browse-categories" class="btn_category"><i class="fa fa-list"></i> Categories List</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
@auth
|
||||
@php
|
||||
$userId = auth()->id();
|
||||
try {
|
||||
$uploadCount = \Illuminate\Support\Facades\DB::table('artworks')->where('user_id', $userId)->count();
|
||||
} catch (\Throwable $e) {
|
||||
$uploadCount = 0;
|
||||
}
|
||||
try {
|
||||
$favCount = \Illuminate\Support\Facades\DB::table('artwork_favourites')->where('user_id', $userId)->count();
|
||||
} catch (\Throwable $e) {
|
||||
$favCount = 0;
|
||||
}
|
||||
try {
|
||||
$msgCount = \Illuminate\Support\Facades\DB::table('messages')->where('reciever_id', $userId)->whereNull('read_at')->count();
|
||||
} catch (\Throwable $e) {
|
||||
$msgCount = 0;
|
||||
}
|
||||
try {
|
||||
$noticeCount = \Illuminate\Support\Facades\DB::table('notification')->where('user_id', $userId)->where('new', 1)->count();
|
||||
} catch (\Throwable $e) {
|
||||
$noticeCount = 0;
|
||||
}
|
||||
try {
|
||||
$profile = \Illuminate\Support\Facades\DB::table('user_profiles')->where('user_id', $userId)->first();
|
||||
$avatarHash = $profile->avatar_hash ?? null;
|
||||
} catch (\Throwable $e) {
|
||||
$avatarHash = null;
|
||||
}
|
||||
$displayName = auth()->user()->name ?: (auth()->user()->username ?? '');
|
||||
@endphp
|
||||
|
||||
<li class="hidden-xs hidden-sm menu_notice">
|
||||
<a href="/upload" title="Upload new Artwork"><i class="fa fa-upload fa-fw"></i><br> {{ $uploadCount }}</a>
|
||||
</li>
|
||||
<li class="hidden-xs hidden-sm menu_notice">
|
||||
<a href="/favourites/{{ $userId }}/{{ auth()->user()->username ?? '' }}" title="Your Favourite Artworks"><i class="fa fa-heart fa-fw"></i><br> {{ $favCount }}</a>
|
||||
</li>
|
||||
<li class="hidden-xs hidden-sm menu_notice">
|
||||
<a href="/messages" title="Messages"><i class="fa fa-envelope fa-fw"></i><br> {{ $msgCount }}</a>
|
||||
</li>
|
||||
<li class="hidden-xs hidden-sm menu_notice">
|
||||
<a href="/notices" title="Notices"><i class="fa fa-bell"></i><br> {{ $noticeCount }}</a>
|
||||
</li>
|
||||
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle c-white" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
|
||||
<img src="{{ \App\Support\AvatarUrl::forUser((int) $userId, $avatarHash ?? null, 32) }}" alt="{{ $displayName }}" width="18">
|
||||
<span class="username">{{ $displayName }}</span>
|
||||
<i class="fa fa-angle-down"></i>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="/upload"><i class="fa fa-upload"></i> Upload</a></li>
|
||||
<li><a href="/studio/artworks"><i class="fa fa-palette"></i> Studio</a></li>
|
||||
<li><a href="{{ route('dashboard.artworks.index') }}"><i class="fa fa-cloud"></i> Edit Artworks</a></li>
|
||||
<li role="presentation" class="divider"></li>
|
||||
<li><a href="/statistics"><i class="fa fa-cog"></i> Statistics</a></li>
|
||||
<li><a href="/mybuddies.php"><i class="fa fa-cog"></i> My Followes</a></li>
|
||||
<li><a href="/buddies.php"><i class="fa fa-cog"></i> Who follows me</a></li>
|
||||
<li role="presentation" class="divider"></li>
|
||||
<li><a href="/recieved-comments"><i class="fa fa-cog"></i> Received Comments</a></li>
|
||||
<li><a href="/favourites/{{ $userId }}/{{ auth()->user()->username ?? '' }}"><i class="fa fa-cog"></i> My Favourites</a></li>
|
||||
<li><a href="/gallery/{{ $userId }}/{{ auth()->user()->username ?? '' }}"><i class="fa fa-cog"></i> My Gallery</a></li>
|
||||
<li role="presentation" class="divider"></li>
|
||||
<li><a href="/user"><i class="fa fa-cog"></i> Edit Profile</a></li>
|
||||
<li><a href="/profile/{{ $userId }}/{{ auth()->user()->username ?? '' }}"><i class="fa fa-cog"></i> View My Profile</a></li>
|
||||
<li class="dropdown-footer clearfix">
|
||||
<form method="POST" action="/logout" style="margin:0;">
|
||||
@csrf
|
||||
<button type="submit" class="btn btn-link" style="padding: 3px 20px;"> <i class="fa fa-power-off"></i> Logout</button>
|
||||
</form>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="hidden-xs hidden-sm menu_chat">
|
||||
<span class="toggle_menu" title="Chat"><i class="fa fa-weixin fa-lg fa-fw"></i></span>
|
||||
</li>
|
||||
@else
|
||||
<li class="dropdown"><a href="/signup" title="Signup for a new account" class="c-white"><i class="fa fa-unlock fa-fw"></i> Join</a></li>
|
||||
<li class="dropdown"><a href="/login" title="Login to Skinbase account" class="c-white"><i class="fa fa-sign-in fa-fw"></i> Sign in</a></li>
|
||||
@endauth
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
@@ -1,57 +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">{{ $page_title ?? 'My Buddies' }}</h1>
|
||||
<p>List of members you are following</p>
|
||||
</header>
|
||||
</div>
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="icon-grid">
|
||||
@forelse($buddies as $b)
|
||||
@php
|
||||
$icon = $b->icon ?? 'default.jpg';
|
||||
$uname = $b->uname ?? 'Unknown';
|
||||
$friendId = $b->friend_id ?? $b->friendId ?? null;
|
||||
@endphp
|
||||
|
||||
@php $buddyUrl = ($b->user_username ?? null) ? '/@' . $b->user_username : '/profile/' . $friendId; @endphp
|
||||
<div class="icon-flex">
|
||||
<div>
|
||||
<a href="{{ $buddyUrl }}">
|
||||
<h4>{{ $uname }}</h4>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<a href="{{ $buddyUrl }}">
|
||||
<img src="{{ \App\Support\AvatarUrl::forUser((int) $friendId, null, 50) }}" alt="{{ $uname }}">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@if(auth()->check() && auth()->id() == ($b->user_id ?? null))
|
||||
<div>
|
||||
<form method="POST" action="{{ route('legacy.mybuddies.delete', ['id' => $b->id]) }}" onsubmit="return confirm('Really Remove From Friends List: {{ addslashes($uname) }}?');">
|
||||
@csrf
|
||||
@method('DELETE')
|
||||
<button class="btn btn-link" type="submit"><img src="/gfx/icon_delete.gif" alt="remove"></button>
|
||||
</form>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
</div>
|
||||
@empty
|
||||
<p>No buddies yet.</p>
|
||||
@endforelse
|
||||
</div>
|
||||
|
||||
@if(method_exists($buddies, 'links'))
|
||||
<div class="mt-3">{{ $buddies->links() }}</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
@@ -353,7 +353,7 @@
|
||||
<div class="nova-panel-header">
|
||||
<i class="fa-solid fa-images fa-fw text-[--sb-blue]"></i>
|
||||
Newest Artworks
|
||||
<a href="/gallery/{{ $user->id }}/{{ \Illuminate\Support\Str::slug($uname) }}"
|
||||
<a href="{{ !empty($user->username) ? route('profile.gallery', ['username' => strtolower((string) $user->username)]) : url('/gallery/'.$user->id.'/'.\Illuminate\Support\Str::slug($uname)) }}"
|
||||
class="ml-auto text-xs text-[--sb-blue] hover:underline normal-case tracking-normal font-normal">
|
||||
View Gallery <i class="fa-solid fa-arrow-right fa-fw"></i>
|
||||
</a>
|
||||
|
||||
108
resources/views/admin/countries/cpad.blade.php
Normal file
108
resources/views/admin/countries/cpad.blade.php
Normal file
@@ -0,0 +1,108 @@
|
||||
@extends('admin::layout.default')
|
||||
|
||||
@section('content')
|
||||
<x-page-layout>
|
||||
@include('admin::blocks.notification_error')
|
||||
|
||||
@if(session('msg_success'))
|
||||
<div class="alert alert-success alert-dismissible">
|
||||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||||
{{ session('msg_success') }}
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-8">
|
||||
<h3 class="mb-1">Countries</h3>
|
||||
<p class="text-muted mb-0">Read-only ISO country catalog with manual sync support.</p>
|
||||
</div>
|
||||
<div class="col-md-4 text-right">
|
||||
<form method="POST" action="{{ route('admin.cp.countries.sync') }}">
|
||||
@csrf
|
||||
<button type="submit" class="btn btn-primary btn-sm">
|
||||
<i class="fa-solid fa-rotate"></i> Sync countries
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<form method="GET" action="{{ route('admin.cp.countries.main') }}" class="form-inline">
|
||||
<div class="input-group input-group-sm" style="max-width: 420px; width: 100%;">
|
||||
<input
|
||||
type="text"
|
||||
name="q"
|
||||
value="{{ $search }}"
|
||||
placeholder="Search by code or name"
|
||||
class="form-control"
|
||||
/>
|
||||
<div class="input-group-append">
|
||||
<button type="submit" class="btn btn-default">Search</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="card-body table-responsive p-0">
|
||||
<table class="table table-hover table-sm mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Country</th>
|
||||
<th>ISO2</th>
|
||||
<th>ISO3</th>
|
||||
<th>Region</th>
|
||||
<th>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@forelse ($countries as $country)
|
||||
<tr>
|
||||
<td>
|
||||
<div class="d-flex align-items-center" style="gap: 10px;">
|
||||
@if ($country->local_flag_path)
|
||||
<img
|
||||
src="{{ $country->local_flag_path }}"
|
||||
alt="{{ $country->name_common }}"
|
||||
style="width: 24px; height: 16px; object-fit: cover; border-radius: 2px;"
|
||||
onerror="this.style.display='none'"
|
||||
>
|
||||
@endif
|
||||
<div>
|
||||
<div>{{ $country->name_common }}</div>
|
||||
@if ($country->name_official)
|
||||
<small class="text-muted">{{ $country->name_official }}</small>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td><code>{{ $country->iso2 }}</code></td>
|
||||
<td><code>{{ $country->iso3 ?? '—' }}</code></td>
|
||||
<td>{{ $country->region ?? '—' }}</td>
|
||||
<td>
|
||||
@if ($country->active)
|
||||
<span class="badge badge-success">Active</span>
|
||||
@else
|
||||
<span class="badge badge-secondary">Inactive</span>
|
||||
@endif
|
||||
|
||||
@if ($country->is_featured)
|
||||
<span class="badge badge-info">Featured</span>
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@empty
|
||||
<tr>
|
||||
<td colspan="5" class="text-center text-muted py-4">No countries found.</td>
|
||||
</tr>
|
||||
@endforelse
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="card-footer clearfix">
|
||||
{{ $countries->links() }}
|
||||
</div>
|
||||
</div>
|
||||
</x-page-layout>
|
||||
@endsection
|
||||
99
resources/views/admin/countries/index.blade.php
Normal file
99
resources/views/admin/countries/index.blade.php
Normal file
@@ -0,0 +1,99 @@
|
||||
@extends('layouts.nova')
|
||||
|
||||
@section('content')
|
||||
<div class="mx-auto max-w-6xl px-4 py-8">
|
||||
<div class="mb-4 flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
|
||||
<div>
|
||||
<h1 class="text-xl font-semibold text-gray-100">Countries</h1>
|
||||
<p class="mt-1 text-sm text-gray-400">Read-only ISO country catalog with manual sync support.</p>
|
||||
</div>
|
||||
|
||||
<form method="post" action="{{ route('admin.countries.sync') }}">
|
||||
@csrf
|
||||
<button type="submit" class="rounded-lg border border-sky-500/40 bg-sky-500/10 px-3 py-2 text-sm text-sky-200">
|
||||
Sync countries
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
@if (session('success'))
|
||||
<div class="mb-4 rounded-lg border border-emerald-500/30 bg-emerald-500/10 px-4 py-3 text-sm text-emerald-200">
|
||||
{{ session('success') }}
|
||||
</div>
|
||||
@endif
|
||||
|
||||
@if (session('error'))
|
||||
<div class="mb-4 rounded-lg border border-red-500/30 bg-red-500/10 px-4 py-3 text-sm text-red-200">
|
||||
{{ session('error') }}
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<form method="get" action="{{ route('admin.countries.index') }}" class="mb-4">
|
||||
<div class="flex flex-col gap-3 md:flex-row md:items-center">
|
||||
<input
|
||||
type="text"
|
||||
name="q"
|
||||
value="{{ $search }}"
|
||||
placeholder="Search by code or name"
|
||||
class="w-full rounded-lg border border-gray-700 bg-gray-900 px-3 py-2 text-sm text-gray-100 placeholder:text-gray-500 md:max-w-sm"
|
||||
/>
|
||||
<button type="submit" class="rounded-lg border border-gray-700 bg-gray-900 px-3 py-2 text-sm text-gray-200">Search</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="overflow-hidden rounded-xl border border-gray-700 bg-gray-900">
|
||||
<table class="min-w-full divide-y divide-gray-700 text-sm">
|
||||
<thead class="bg-gray-800 text-gray-300">
|
||||
<tr>
|
||||
<th class="px-4 py-3 text-left">Country</th>
|
||||
<th class="px-4 py-3 text-left">ISO2</th>
|
||||
<th class="px-4 py-3 text-left">ISO3</th>
|
||||
<th class="px-4 py-3 text-left">Region</th>
|
||||
<th class="px-4 py-3 text-left">Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="divide-y divide-gray-800 text-gray-200">
|
||||
@forelse ($countries as $country)
|
||||
<tr>
|
||||
<td class="px-4 py-3">
|
||||
<div class="flex items-center gap-2">
|
||||
@if ($country->local_flag_path)
|
||||
<img
|
||||
src="{{ $country->local_flag_path }}"
|
||||
alt="{{ $country->name_common }}"
|
||||
class="h-4 w-6 rounded-sm object-cover"
|
||||
onerror="this.style.display='none'"
|
||||
>
|
||||
@endif
|
||||
<div>
|
||||
<div>{{ $country->name_common }}</div>
|
||||
@if ($country->name_official)
|
||||
<div class="text-xs text-gray-500">{{ $country->name_official }}</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-4 py-3 font-mono">{{ $country->iso2 }}</td>
|
||||
<td class="px-4 py-3 font-mono">{{ $country->iso3 ?? '—' }}</td>
|
||||
<td class="px-4 py-3">{{ $country->region ?? '—' }}</td>
|
||||
<td class="px-4 py-3">
|
||||
<span class="inline-flex items-center rounded-full px-2.5 py-1 text-xs {{ $country->active ? 'bg-emerald-500/10 text-emerald-200' : 'bg-gray-700 text-gray-300' }}">
|
||||
{{ $country->active ? 'Active' : 'Inactive' }}
|
||||
</span>
|
||||
@if ($country->is_featured)
|
||||
<span class="ml-2 inline-flex items-center rounded-full bg-sky-500/10 px-2.5 py-1 text-xs text-sky-200">Featured</span>
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@empty
|
||||
<tr>
|
||||
<td colspan="5" class="px-4 py-6 text-center text-gray-400">No countries found.</td>
|
||||
</tr>
|
||||
@endforelse
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="mt-4">{{ $countries->links() }}</div>
|
||||
</div>
|
||||
@endsection
|
||||
@@ -4,11 +4,18 @@
|
||||
@vite(['resources/js/dashboard/index.jsx'])
|
||||
@endpush
|
||||
|
||||
@section('main-class', 'pt-20')
|
||||
|
||||
@section('content')
|
||||
<div
|
||||
id="dashboard-root"
|
||||
data-username="{{ $dashboard_user_name }}"
|
||||
data-is-creator="{{ $dashboard_is_creator ? '1' : '0' }}"
|
||||
data-level="{{ $dashboard_level ?? 1 }}"
|
||||
data-rank="{{ $dashboard_rank ?? 'Newbie' }}"
|
||||
data-received-comments-count="{{ (int) ($dashboard_received_comments_count ?? 0) }}"
|
||||
data-overview='@json($dashboard_overview ?? [])'
|
||||
data-preferences='@json($dashboard_preferences ?? [])'
|
||||
></div>
|
||||
|
||||
@if (session('status'))
|
||||
|
||||
@@ -3,27 +3,241 @@
|
||||
@section('content')
|
||||
<x-nova-page-header
|
||||
section="Dashboard"
|
||||
title="Comments"
|
||||
title="Received Comments"
|
||||
icon="fa-comments"
|
||||
:breadcrumbs="collect([
|
||||
(object) ['name' => 'Dashboard', 'url' => '/dashboard'],
|
||||
(object) ['name' => 'Comments', 'url' => route('dashboard.comments')],
|
||||
(object) ['name' => 'Comments', 'url' => route('dashboard.comments.received')],
|
||||
])"
|
||||
description="Comments across your dashboard activity and conversations."
|
||||
/>
|
||||
description="A clean inbox for feedback on your artworks, with quick scanning, filtering, and direct artwork context."
|
||||
>
|
||||
<x-slot name="actions">
|
||||
<div class="flex flex-wrap items-center gap-2">
|
||||
<a href="{{ route('community.activity') }}"
|
||||
class="inline-flex items-center gap-2 rounded-lg border border-white/[0.08] bg-white/[0.04] px-4 py-2 text-sm font-medium text-white/70 transition-colors hover:bg-white/[0.08] hover:text-white">
|
||||
<i class="fa-solid fa-wave-square text-xs"></i>
|
||||
Community activity
|
||||
</a>
|
||||
</div>
|
||||
</x-slot>
|
||||
</x-nova-page-header>
|
||||
|
||||
<div class="px-6 pb-16 pt-8 md:px-10">
|
||||
@if(empty($comments))
|
||||
<div class="rounded-xl border border-white/[0.06] bg-white/[0.02] px-8 py-12 text-center">
|
||||
<p class="text-sm text-white/40">No comments to show.</p>
|
||||
<div class="mb-6 flex flex-wrap items-center gap-2 rounded-2xl border border-white/[0.06] bg-white/[0.025] p-2 shadow-[0_12px_30px_rgba(0,0,0,0.14)]">
|
||||
<a href="{{ route('dashboard.comments.received') }}"
|
||||
class="inline-flex items-center gap-2 rounded-xl px-4 py-2 text-sm font-medium transition {{ request()->routeIs('dashboard.comments.received') ? 'bg-sky-500/15 text-sky-200 ring-1 ring-sky-400/20' : 'text-white/60 hover:bg-white/[0.05] hover:text-white' }}">
|
||||
<i class="fa-solid fa-inbox"></i>
|
||||
Received
|
||||
</a>
|
||||
<a href="{{ route('messages.index') }}"
|
||||
class="inline-flex items-center gap-2 rounded-xl px-4 py-2 text-sm font-medium text-white/60 transition hover:bg-white/[0.05] hover:text-white">
|
||||
<i class="fa-solid fa-envelope"></i>
|
||||
Messages
|
||||
</a>
|
||||
<a href="{{ route('dashboard.notifications') }}"
|
||||
class="inline-flex items-center gap-2 rounded-xl px-4 py-2 text-sm font-medium text-white/60 transition hover:bg-white/[0.05] hover:text-white">
|
||||
<i class="fa-solid fa-bell"></i>
|
||||
Notifications
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@if(($freshlyClearedCount ?? 0) > 0)
|
||||
<div class="mb-6 rounded-2xl border border-emerald-400/20 bg-emerald-500/10 px-5 py-4 text-sm text-emerald-100 shadow-[0_12px_30px_rgba(16,185,129,0.12)]">
|
||||
Marked {{ number_format((int) $freshlyClearedCount) }} new {{ (int) $freshlyClearedCount === 1 ? 'comment' : 'comments' }} as read when you opened this inbox.
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="mb-6 grid gap-4 sm:grid-cols-2 xl:grid-cols-4">
|
||||
<div class="rounded-2xl border border-sky-400/20 bg-sky-500/10 p-5 shadow-[0_18px_45px_rgba(10,132,255,0.10)]">
|
||||
<p class="text-xs font-semibold uppercase tracking-[0.22em] text-sky-200/75">Total comments</p>
|
||||
<p class="mt-3 text-3xl font-semibold text-white">{{ number_format((int) ($stats['total'] ?? 0)) }}</p>
|
||||
<p class="mt-2 text-sm text-sky-100/70">All comments on your approved artworks.</p>
|
||||
</div>
|
||||
|
||||
<div class="rounded-2xl border border-emerald-400/20 bg-emerald-500/10 p-5">
|
||||
<p class="text-xs font-semibold uppercase tracking-[0.22em] text-emerald-200/75">Last 7 days</p>
|
||||
<p class="mt-3 text-3xl font-semibold text-white">{{ number_format((int) ($stats['recent'] ?? 0)) }}</p>
|
||||
<p class="mt-2 text-sm text-emerald-100/70">Recent conversation momentum.</p>
|
||||
</div>
|
||||
|
||||
<div class="rounded-2xl border border-violet-400/20 bg-violet-500/10 p-5">
|
||||
<p class="text-xs font-semibold uppercase tracking-[0.22em] text-violet-200/75">Unique commenters</p>
|
||||
<p class="mt-3 text-3xl font-semibold text-white">{{ number_format((int) ($stats['commenters'] ?? 0)) }}</p>
|
||||
<p class="mt-2 text-sm text-violet-100/70">Distinct people engaging with your work.</p>
|
||||
</div>
|
||||
|
||||
<div class="rounded-2xl border border-amber-400/20 bg-amber-500/10 p-5">
|
||||
<p class="text-xs font-semibold uppercase tracking-[0.22em] text-amber-200/75">Active artworks</p>
|
||||
<p class="mt-3 text-3xl font-semibold text-white">{{ number_format((int) ($stats['artworks'] ?? 0)) }}</p>
|
||||
<p class="mt-2 text-sm text-amber-100/70">Artworks that received comments.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-6 rounded-[26px] border border-white/[0.07] bg-white/[0.03] p-4 shadow-[0_18px_45px_rgba(0,0,0,0.18)] md:p-5">
|
||||
<form method="GET" action="{{ route('dashboard.comments.received') }}" class="flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between">
|
||||
<div class="flex flex-1 flex-col gap-3 sm:flex-row">
|
||||
<label class="relative flex-1">
|
||||
<span class="pointer-events-none absolute left-4 top-1/2 -translate-y-1/2 text-white/30">
|
||||
<i class="fa-solid fa-magnifying-glass"></i>
|
||||
</span>
|
||||
<input
|
||||
type="search"
|
||||
name="q"
|
||||
value="{{ $search }}"
|
||||
placeholder="Search comment text, artwork title, or username"
|
||||
class="w-full rounded-2xl border border-white/[0.08] bg-black/20 py-3 pl-11 pr-4 text-sm text-white placeholder:text-white/30 outline-none transition focus:border-sky-400/40 focus:bg-black/30"
|
||||
>
|
||||
</label>
|
||||
|
||||
<select
|
||||
name="sort"
|
||||
class="rounded-2xl border border-white/[0.08] bg-black/20 px-4 py-3 text-sm text-white outline-none transition focus:border-sky-400/40 focus:bg-black/30"
|
||||
>
|
||||
<option value="newest" @selected($sort === 'newest')>Newest first</option>
|
||||
<option value="oldest" @selected($sort === 'oldest')>Oldest first</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-2">
|
||||
<button
|
||||
type="submit"
|
||||
class="inline-flex items-center gap-2 rounded-2xl bg-sky-500 px-4 py-3 text-sm font-semibold text-white transition hover:bg-sky-400"
|
||||
>
|
||||
<i class="fa-solid fa-sliders"></i>
|
||||
Apply
|
||||
</button>
|
||||
|
||||
@if($search !== '' || $sort !== 'newest')
|
||||
<a
|
||||
href="{{ route('dashboard.comments.received') }}"
|
||||
class="inline-flex items-center gap-2 rounded-2xl border border-white/[0.08] bg-white/[0.03] px-4 py-3 text-sm font-medium text-white/65 transition hover:bg-white/[0.07] hover:text-white"
|
||||
>
|
||||
<i class="fa-solid fa-rotate-left"></i>
|
||||
Reset
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
@if($comments->isEmpty())
|
||||
<div class="rounded-[28px] border border-white/[0.07] bg-white/[0.025] px-8 py-16 text-center shadow-[0_18px_45px_rgba(0,0,0,0.18)]">
|
||||
<div class="mx-auto flex h-16 w-16 items-center justify-center rounded-full border border-white/[0.08] bg-white/[0.03] text-white/35">
|
||||
<i class="fa-regular fa-comments text-2xl"></i>
|
||||
</div>
|
||||
<h2 class="mt-5 text-2xl font-semibold text-white">No comments found</h2>
|
||||
<p class="mx-auto mt-3 max-w-xl text-sm leading-6 text-white/45">
|
||||
@if($search !== '')
|
||||
Nothing matched your current search. Try a shorter phrase, a username, or reset the filters.
|
||||
@else
|
||||
When members comment on your artworks, they will appear here with artwork previews and quick context.
|
||||
@endif
|
||||
</p>
|
||||
</div>
|
||||
@else
|
||||
<div class="rounded-xl border border-white/[0.06] bg-white/[0.02] p-6">
|
||||
<ul class="space-y-2">
|
||||
@foreach($comments as $c)
|
||||
<li class="text-sm text-white/75">{{ $c }}</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
<div class="grid gap-5 lg:grid-cols-2 2xl:grid-cols-3">
|
||||
@foreach($comments as $comment)
|
||||
@php
|
||||
$author = $comment->user;
|
||||
$artwork = $comment->artwork;
|
||||
$profileUrl = !empty($author?->username)
|
||||
? '/@' . $author->username
|
||||
: '/profile/' . (int) ($author?->id ?? 0);
|
||||
$artworkUrl = $artwork
|
||||
? '/art/' . (int) $artwork->id . '/' . \Illuminate\Support\Str::slug($artwork->title ?? $artwork->name ?? 'artwork')
|
||||
: null;
|
||||
@endphp
|
||||
|
||||
<article class="group flex h-full flex-col overflow-hidden rounded-[28px] border border-white/[0.07] bg-white/[0.025] shadow-[0_18px_45px_rgba(0,0,0,0.18)] transition hover:border-sky-400/20 hover:bg-white/[0.035]">
|
||||
<div class="border-b border-white/[0.06] bg-black/20">
|
||||
@if($artwork)
|
||||
<a href="{{ $artworkUrl }}" class="block">
|
||||
<img
|
||||
src="{{ $artwork->thumb_url ?? $artwork->thumb }}"
|
||||
alt="{{ $artwork->title ?? $artwork->name ?? 'Artwork' }}"
|
||||
class="h-52 w-full object-cover transition duration-500 group-hover:scale-[1.02]"
|
||||
>
|
||||
</a>
|
||||
@else
|
||||
<div class="flex h-52 items-center justify-center text-white/25">
|
||||
<i class="fa-regular fa-image text-4xl"></i>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="flex flex-1 flex-col p-5 md:p-6">
|
||||
<div class="flex flex-col gap-4 md:flex-row md:items-start md:justify-between">
|
||||
<div class="flex min-w-0 items-center gap-3">
|
||||
<a href="{{ $profileUrl }}" class="shrink-0">
|
||||
<img
|
||||
src="{{ \App\Support\AvatarUrl::forUser((int) ($author?->id ?? 0), $author?->profile?->avatar_hash, 64) }}"
|
||||
alt="{{ $author?->name ?? $author?->username ?? 'Member' }}"
|
||||
class="h-12 w-12 rounded-full object-cover ring-1 ring-white/[0.10]"
|
||||
>
|
||||
</a>
|
||||
<div class="min-w-0">
|
||||
<div class="flex flex-wrap items-center gap-x-2 gap-y-1">
|
||||
<a href="{{ $profileUrl }}" class="truncate text-base font-semibold text-white transition hover:text-sky-300">
|
||||
{{ $author?->name ?? $author?->username ?? 'Unknown member' }}
|
||||
</a>
|
||||
@if(!empty($author?->username))
|
||||
<span class="truncate text-xs font-medium uppercase tracking-[0.18em] text-white/30">{{ '@' . $author->username }}</span>
|
||||
@endif
|
||||
</div>
|
||||
<p class="mt-1 text-sm text-white/45">
|
||||
{{ optional($comment->created_at)->diffForHumans() ?? 'Unknown time' }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-wrap items-center gap-2 text-xs font-medium">
|
||||
<span class="inline-flex items-center gap-1.5 rounded-full border border-white/[0.08] bg-white/[0.03] px-3 py-1 text-white/60">
|
||||
<i class="fa-solid fa-message"></i>
|
||||
Comment #{{ $comment->id }}
|
||||
</span>
|
||||
@if($artworkUrl)
|
||||
<a href="{{ $artworkUrl }}" class="inline-flex items-center gap-1.5 rounded-full border border-sky-400/20 bg-sky-500/10 px-3 py-1 text-sky-200 transition hover:bg-sky-500/20">
|
||||
<i class="fa-solid fa-arrow-up-right-from-square"></i>
|
||||
Open artwork
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-5 rounded-2xl border border-white/[0.06] bg-black/20 p-4 md:p-5">
|
||||
<div class="prose prose-invert prose-sm max-w-none prose-p:text-white/80 prose-a:text-sky-300 prose-strong:text-white prose-code:text-sky-200">
|
||||
{!! $comment->getDisplayHtml() !!}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-auto pt-5">
|
||||
<div class="flex flex-col gap-3 border-t border-white/[0.06] pt-4 md:flex-row md:items-center md:justify-between">
|
||||
<div class="min-w-0">
|
||||
<p class="text-xs font-semibold uppercase tracking-[0.18em] text-white/30">Artwork</p>
|
||||
@if($artwork)
|
||||
<a href="{{ $artworkUrl }}" class="mt-1 block truncate text-sm font-medium text-white/80 transition hover:text-sky-300">
|
||||
{{ $artwork->title ?? $artwork->name ?? 'Untitled artwork' }}
|
||||
</a>
|
||||
@else
|
||||
<p class="mt-1 text-sm text-white/35">This artwork is no longer available.</p>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="flex flex-wrap items-center gap-2 text-xs text-white/45">
|
||||
<span class="inline-flex items-center gap-1.5 rounded-full bg-white/[0.03] px-3 py-1">
|
||||
<i class="fa-regular fa-clock"></i>
|
||||
{{ optional($comment->created_at)->format('M j, Y H:i') ?? 'Unknown date' }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
<div class="mt-8 flex justify-center">
|
||||
{{ $comments->links() }}
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
187
resources/views/dashboard/notifications.blade.php
Normal file
187
resources/views/dashboard/notifications.blade.php
Normal file
@@ -0,0 +1,187 @@
|
||||
@extends('layouts.nova')
|
||||
|
||||
@section('content')
|
||||
<x-nova-page-header
|
||||
section="Dashboard"
|
||||
title="Notifications"
|
||||
icon="fa-bell"
|
||||
:breadcrumbs="collect([
|
||||
(object) ['name' => 'Dashboard', 'url' => '/dashboard'],
|
||||
(object) ['name' => 'Notifications', 'url' => route('dashboard.notifications')],
|
||||
])"
|
||||
description="A dedicated feed for follows, likes, comments, and system events so you can triage account activity quickly."
|
||||
>
|
||||
<x-slot name="actions">
|
||||
<form id="mark-all-notifications-read-form" class="contents">
|
||||
<button
|
||||
type="button"
|
||||
id="mark-all-notifications-read"
|
||||
class="inline-flex items-center gap-2 rounded-lg border border-white/[0.08] bg-white/[0.04] px-4 py-2 text-sm font-medium text-white/70 transition-colors hover:bg-white/[0.08] hover:text-white"
|
||||
>
|
||||
<i class="fa-solid fa-check-double text-xs"></i>
|
||||
Mark all read
|
||||
</button>
|
||||
</form>
|
||||
</x-slot>
|
||||
</x-nova-page-header>
|
||||
|
||||
<div class="px-6 pb-16 pt-8 md:px-10">
|
||||
<div class="mb-6 flex flex-wrap items-center gap-2 rounded-2xl border border-white/[0.06] bg-white/[0.025] p-2 shadow-[0_12px_30px_rgba(0,0,0,0.14)]">
|
||||
<a href="{{ route('dashboard.comments.received') }}"
|
||||
class="inline-flex items-center gap-2 rounded-xl px-4 py-2 text-sm font-medium text-white/60 transition hover:bg-white/[0.05] hover:text-white">
|
||||
<i class="fa-solid fa-inbox"></i>
|
||||
Received
|
||||
</a>
|
||||
<a href="{{ route('messages.index') }}"
|
||||
class="inline-flex items-center gap-2 rounded-xl px-4 py-2 text-sm font-medium text-white/60 transition hover:bg-white/[0.05] hover:text-white">
|
||||
<i class="fa-solid fa-envelope"></i>
|
||||
Messages
|
||||
</a>
|
||||
<a href="{{ route('dashboard.notifications') }}"
|
||||
class="inline-flex items-center gap-2 rounded-xl px-4 py-2 text-sm font-medium transition {{ request()->routeIs('dashboard.notifications') ? 'bg-sky-500/15 text-sky-200 ring-1 ring-sky-400/20' : 'text-white/60 hover:bg-white/[0.05] hover:text-white' }}">
|
||||
<i class="fa-solid fa-bell"></i>
|
||||
Notifications
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="mb-6 grid gap-4 sm:grid-cols-2 xl:grid-cols-3">
|
||||
<div class="rounded-2xl border border-sky-400/20 bg-sky-500/10 p-5 shadow-[0_18px_45px_rgba(10,132,255,0.10)]">
|
||||
<p class="text-xs font-semibold uppercase tracking-[0.22em] text-sky-200/75">Unread</p>
|
||||
<p class="mt-3 text-3xl font-semibold text-white">{{ number_format($unreadCount) }}</p>
|
||||
<p class="mt-2 text-sm text-sky-100/70">Notifications that still need attention.</p>
|
||||
</div>
|
||||
<div class="rounded-2xl border border-violet-400/20 bg-violet-500/10 p-5">
|
||||
<p class="text-xs font-semibold uppercase tracking-[0.22em] text-violet-200/75">Loaded</p>
|
||||
<p class="mt-3 text-3xl font-semibold text-white">{{ number_format($notifications->count()) }}</p>
|
||||
<p class="mt-2 text-sm text-violet-100/70">Items shown on this page.</p>
|
||||
</div>
|
||||
<div class="rounded-2xl border border-amber-400/20 bg-amber-500/10 p-5">
|
||||
<p class="text-xs font-semibold uppercase tracking-[0.22em] text-amber-200/75">Total feed</p>
|
||||
<p class="mt-3 text-3xl font-semibold text-white">{{ number_format((int) ($notificationsMeta['total'] ?? 0)) }}</p>
|
||||
<p class="mt-2 text-sm text-amber-100/70">All notifications stored for your account.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if($notifications->isEmpty())
|
||||
<div class="rounded-[28px] border border-white/[0.07] bg-white/[0.025] px-8 py-16 text-center shadow-[0_18px_45px_rgba(0,0,0,0.18)]">
|
||||
<div class="mx-auto flex h-16 w-16 items-center justify-center rounded-full border border-white/[0.08] bg-white/[0.03] text-white/35">
|
||||
<i class="fa-regular fa-bell text-2xl"></i>
|
||||
</div>
|
||||
<h2 class="mt-5 text-2xl font-semibold text-white">No notifications yet</h2>
|
||||
<p class="mx-auto mt-3 max-w-xl text-sm leading-6 text-white/45">
|
||||
Follows, comments, likes, and system notices will appear here as your account becomes more active.
|
||||
</p>
|
||||
</div>
|
||||
@else
|
||||
<div class="space-y-4">
|
||||
@foreach($notifications as $item)
|
||||
@php
|
||||
$isUnread = !($item['read'] ?? false);
|
||||
$actor = $item['actor'] ?? null;
|
||||
$destination = $item['url'] ?: route('dashboard.comments.received');
|
||||
@endphp
|
||||
<a
|
||||
href="{{ $destination }}"
|
||||
class="block rounded-[24px] border p-5 transition hover:bg-white/[0.04] {{ $isUnread ? 'border-sky-400/20 bg-sky-500/[0.08]' : 'border-white/[0.07] bg-white/[0.025]' }}"
|
||||
data-notification-link
|
||||
data-notification-id="{{ $item['id'] }}"
|
||||
data-notification-read="{{ ($item['read'] ?? false) ? '1' : '0' }}"
|
||||
>
|
||||
<div class="flex items-start gap-4">
|
||||
<img
|
||||
src="{{ $actor['avatar_url'] ?? 'https://files.skinbase.org/default/avatar_default.webp' }}"
|
||||
alt="{{ $actor['name'] ?? 'Notification' }}"
|
||||
class="h-12 w-12 rounded-full object-cover ring-1 ring-white/10"
|
||||
>
|
||||
<div class="min-w-0 flex-1">
|
||||
<div class="flex flex-col gap-2 md:flex-row md:items-start md:justify-between">
|
||||
<div class="min-w-0">
|
||||
<p class="text-sm font-semibold text-white/90">{{ $item['message'] ?? 'New activity' }}</p>
|
||||
<div class="mt-1 flex flex-wrap items-center gap-2 text-xs uppercase tracking-[0.16em] text-white/30">
|
||||
<span>{{ $item['type'] ?? 'notification' }}</span>
|
||||
<span>{{ $item['time_ago'] ?? '' }}</span>
|
||||
@if(!empty($actor['username']))
|
||||
<span>{{ '@' . $actor['username'] }}</span>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
@if($isUnread)
|
||||
<span class="inline-flex items-center gap-1.5 rounded-full border border-sky-400/25 bg-sky-500/12 px-3 py-1 text-xs font-semibold text-sky-200">
|
||||
<i class="fa-solid fa-circle text-[8px]"></i>
|
||||
Unread
|
||||
</span>
|
||||
@else
|
||||
<span class="inline-flex items-center gap-1.5 rounded-full border border-white/[0.08] bg-white/[0.03] px-3 py-1 text-xs font-semibold text-white/50">
|
||||
Read
|
||||
</span>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
@if(($notificationsMeta['last_page'] ?? 1) > 1)
|
||||
<div class="mt-8 flex flex-wrap justify-center gap-2">
|
||||
@for($page = 1; $page <= (int) ($notificationsMeta['last_page'] ?? 1); $page++)
|
||||
<a
|
||||
href="{{ route('dashboard.notifications', ['page' => $page]) }}"
|
||||
class="inline-flex h-10 min-w-10 items-center justify-center rounded-xl border px-3 text-sm font-medium transition {{ (int) ($notificationsMeta['current_page'] ?? 1) === $page ? 'border-sky-400/30 bg-sky-500/15 text-sky-200' : 'border-white/[0.08] bg-white/[0.03] text-white/60 hover:bg-white/[0.06] hover:text-white' }}"
|
||||
>
|
||||
{{ $page }}
|
||||
</a>
|
||||
@endfor
|
||||
</div>
|
||||
@endif
|
||||
@endif
|
||||
</div>
|
||||
|
||||
@push('scripts')
|
||||
<script>
|
||||
(function () {
|
||||
var csrfToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute('content') || '';
|
||||
var markAllButton = document.getElementById('mark-all-notifications-read');
|
||||
|
||||
async function postJson(url) {
|
||||
return fetch(url, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
Accept: 'application/json',
|
||||
'X-CSRF-TOKEN': csrfToken,
|
||||
},
|
||||
credentials: 'same-origin',
|
||||
});
|
||||
}
|
||||
|
||||
if (markAllButton) {
|
||||
markAllButton.addEventListener('click', async function () {
|
||||
markAllButton.disabled = true;
|
||||
try {
|
||||
await postJson('/api/notifications/read-all');
|
||||
window.location.reload();
|
||||
} catch (_error) {
|
||||
markAllButton.disabled = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
document.querySelectorAll('[data-notification-link]').forEach(function (link) {
|
||||
link.addEventListener('click', async function (event) {
|
||||
if (link.dataset.notificationRead === '1') return;
|
||||
|
||||
event.preventDefault();
|
||||
try {
|
||||
await postJson('/api/notifications/' + link.dataset.notificationId + '/read');
|
||||
} catch (_error) {
|
||||
// Navigate even if mark-read fails.
|
||||
}
|
||||
window.location.assign(link.href);
|
||||
});
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
@endpush
|
||||
@endsection
|
||||
@@ -66,6 +66,9 @@
|
||||
[x-cloak] { display: none !important; }
|
||||
</style>
|
||||
@stack('head')
|
||||
@if(isset($page) && is_array($page))
|
||||
@inertiaHead
|
||||
@endif
|
||||
|
||||
@if(config('services.google_adsense.publisher_id'))
|
||||
{{-- Google AdSense — consent-gated loader --}}
|
||||
|
||||
@@ -28,7 +28,7 @@
|
||||
$navSection = match(true) {
|
||||
request()->is('discover', 'discover/*') => 'discover',
|
||||
request()->is('browse', 'photography', 'wallpapers', 'skins', 'other', 'tags', 'tags/*') => 'browse',
|
||||
request()->is('creators', 'creators/*', 'stories', 'stories/*', 'following') => 'creators',
|
||||
request()->is('creators', 'creators/*', 'stories', 'stories/*', 'following', 'leaderboard') => 'creators',
|
||||
request()->is('forum', 'forum/*', 'news', 'news/*') => 'community',
|
||||
default => null,
|
||||
};
|
||||
@@ -59,6 +59,9 @@
|
||||
<a class="flex items-center gap-3 px-4 py-2.5 text-sm hover:bg-white/5" href="/discover/most-downloaded">
|
||||
<i class="fa-solid fa-download w-4 text-center text-sb-muted"></i>Most Downloaded
|
||||
</a>
|
||||
<a class="flex items-center gap-3 px-4 py-2.5 text-sm hover:bg-white/5" href="{{ route('downloads.today') }}">
|
||||
<i class="fa-solid fa-arrow-down-short-wide w-4 text-center text-sb-muted"></i>Today Downloads
|
||||
</a>
|
||||
<a class="flex items-center gap-3 px-4 py-2.5 text-sm hover:bg-white/5" href="/discover/on-this-day">
|
||||
<i class="fa-solid fa-calendar-day w-4 text-center text-sb-muted"></i>On This Day
|
||||
</a>
|
||||
@@ -115,6 +118,9 @@
|
||||
<a class="flex items-center gap-3 px-4 py-2.5 text-sm hover:bg-white/5" href="/creators/top">
|
||||
<i class="fa-solid fa-star w-4 text-center text-sb-muted"></i>Top Creators
|
||||
</a>
|
||||
<a class="flex items-center gap-3 px-4 py-2.5 text-sm hover:bg-white/5" href="/leaderboard">
|
||||
<i class="fa-solid fa-trophy w-4 text-center text-sb-muted"></i>Leaderboard
|
||||
</a>
|
||||
<a class="flex items-center gap-3 px-4 py-2.5 text-sm hover:bg-white/5" href="/creators/rising">
|
||||
<i class="fa-solid fa-arrow-trend-up w-4 text-center text-sb-muted"></i>Rising Creators
|
||||
</a>
|
||||
@@ -141,6 +147,16 @@
|
||||
<a class="flex items-center gap-3 px-4 py-2.5 text-sm hover:bg-white/5" href="{{ route('community.activity') }}">
|
||||
<i class="fa-solid fa-wave-square w-4 text-center text-sb-muted"></i>Activity Feed
|
||||
</a>
|
||||
@auth
|
||||
<a class="flex items-center justify-between gap-3 px-4 py-2.5 text-sm hover:bg-white/5" href="{{ route('dashboard.comments.received') }}">
|
||||
<span class="flex items-center gap-3">
|
||||
<i class="fa-solid fa-inbox w-4 text-center text-sb-muted"></i>Received Comments
|
||||
</span>
|
||||
@if(($receivedCommentsCount ?? 0) > 0)
|
||||
<span class="rounded-full border border-cyan-400/25 bg-cyan-500/10 px-2 py-0.5 text-[11px] font-semibold text-cyan-200">{{ $receivedCommentsCount }}</span>
|
||||
@endif
|
||||
</a>
|
||||
@endauth
|
||||
<a class="flex items-center gap-3 px-4 py-2.5 text-sm hover:bg-white/5" href="/forum">
|
||||
<i class="fa-solid fa-comments w-4 text-center text-sb-muted"></i>Forum
|
||||
</a>
|
||||
@@ -197,17 +213,7 @@
|
||||
@endif
|
||||
</a>
|
||||
|
||||
<a href="{{ route('dashboard.comments') }}"
|
||||
class="relative w-10 h-10 inline-flex items-center justify-center rounded-lg hover:bg-white/5"
|
||||
title="Notifications">
|
||||
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M18 8a6 6 0 10-12 0c0 7-3 7-3 7h18s-3 0-3-7" />
|
||||
<path d="M13.7 21a2 2 0 01-3.4 0" />
|
||||
</svg>
|
||||
@if(($noticeCount ?? 0) > 0)
|
||||
<span class="absolute -bottom-1 right-0 text-[11px] tabular-nums px-1.5 py-0.5 rounded bg-red-700/70 text-white border border-sb-line">{{ $noticeCount }}</span>
|
||||
@endif
|
||||
</a>
|
||||
<div id="toolbar-notification-root" data-props='@json(['initialUnreadCount' => (int) ($noticeCount ?? 0)])'></div>
|
||||
</div>
|
||||
|
||||
<!-- Profile dropdown -->
|
||||
@@ -266,6 +272,15 @@
|
||||
<span class="w-6 h-6 rounded-md bg-white/5 inline-flex items-center justify-center shrink-0"><i class="fa-solid fa-heart text-xs text-sb-muted"></i></span>
|
||||
My Favorites
|
||||
</a>
|
||||
<a class="flex items-center justify-between gap-3 px-4 py-2.5 text-sm hover:bg-white/5" href="{{ route('dashboard.comments.received') }}">
|
||||
<span class="flex items-center gap-3 min-w-0">
|
||||
<span class="w-6 h-6 rounded-md bg-white/5 inline-flex items-center justify-center shrink-0"><i class="fa-solid fa-inbox text-xs text-sb-muted"></i></span>
|
||||
<span>Received Comments</span>
|
||||
</span>
|
||||
@if(($receivedCommentsCount ?? 0) > 0)
|
||||
<span class="rounded-full border border-cyan-400/25 bg-cyan-500/10 px-2 py-0.5 text-[11px] font-semibold text-cyan-200">{{ $receivedCommentsCount }}</span>
|
||||
@endif
|
||||
</a>
|
||||
|
||||
<div class="border-t border-panel my-1"></div>
|
||||
|
||||
@@ -356,6 +371,7 @@
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="/discover/fresh"><i class="fa-solid fa-bolt w-4 text-center text-sb-muted"></i>Fresh</a>
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="/discover/top-rated"><i class="fa-solid fa-medal w-4 text-center text-sb-muted"></i>Top Rated</a>
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="/discover/most-downloaded"><i class="fa-solid fa-download w-4 text-center text-sb-muted"></i>Most Downloaded</a>
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="{{ route('downloads.today') }}"><i class="fa-solid fa-arrow-down-short-wide w-4 text-center text-sb-muted"></i>Today Downloads</a>
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="/discover/on-this-day"><i class="fa-solid fa-calendar-day w-4 text-center text-sb-muted"></i>On This Day</a>
|
||||
@auth
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="{{ route('discover.for-you') }}"><i class="fa-solid fa-wand-magic-sparkles w-4 text-center text-yellow-400/70"></i>For You</a>
|
||||
@@ -385,6 +401,7 @@
|
||||
</button>
|
||||
<div id="mobileSectionCreators" data-mobile-section-panel class="hidden mt-0.5 space-y-0.5">
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="/creators/top"><i class="fa-solid fa-star w-4 text-center text-sb-muted"></i>Top Creators</a>
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="/leaderboard"><i class="fa-solid fa-trophy w-4 text-center text-sb-muted"></i>Leaderboard</a>
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="/creators/rising"><i class="fa-solid fa-arrow-trend-up w-4 text-center text-sb-muted"></i>Rising Creators</a>
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="/stories"><i class="fa-solid fa-microphone w-4 text-center text-sb-muted"></i>Creator Stories</a>
|
||||
@auth
|
||||
@@ -401,6 +418,9 @@
|
||||
</button>
|
||||
<div id="mobileSectionCommunity" data-mobile-section-panel class="hidden mt-0.5 space-y-0.5">
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="{{ route('community.activity') }}"><i class="fa-solid fa-wave-square w-4 text-center text-sb-muted"></i>Activity Feed</a>
|
||||
@auth
|
||||
<a class="flex items-center justify-between gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="{{ route('dashboard.comments.received') }}"><span class="flex items-center gap-3"><i class="fa-solid fa-inbox w-4 text-center text-sb-muted"></i>Received Comments</span>@if(($receivedCommentsCount ?? 0) > 0)<span class="rounded-full border border-cyan-400/25 bg-cyan-500/10 px-2 py-0.5 text-[11px] font-semibold text-cyan-200">{{ $receivedCommentsCount }}</span>@endif</a>
|
||||
@endauth
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="/forum"><i class="fa-solid fa-comments w-4 text-center text-sb-muted"></i>Forum</a>
|
||||
<a class="flex items-center gap-3 py-2.5 px-3 rounded-lg hover:bg-white/5" href="/news"><i class="fa-solid fa-newspaper w-4 text-center text-sb-muted"></i>News</a>
|
||||
</div>
|
||||
|
||||
9
resources/views/leaderboard.blade.php
Normal file
9
resources/views/leaderboard.blade.php
Normal file
@@ -0,0 +1,9 @@
|
||||
@extends('layouts.nova')
|
||||
|
||||
@push('head')
|
||||
@vite(['resources/js/leaderboard.jsx'])
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
@inertia
|
||||
@endsection
|
||||
@@ -7,6 +7,37 @@
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<x-nova-page-header
|
||||
section="Dashboard"
|
||||
title="Messages"
|
||||
icon="fa-envelope"
|
||||
:breadcrumbs="collect([
|
||||
(object) ['name' => 'Dashboard', 'url' => '/dashboard'],
|
||||
(object) ['name' => 'Messages', 'url' => route('messages.index')],
|
||||
])"
|
||||
description="Direct messages and group conversations with creators, staff, and community members."
|
||||
/>
|
||||
|
||||
<div class="px-6 pt-8 md:px-10">
|
||||
<div class="mb-6 flex flex-wrap items-center gap-2 rounded-2xl border border-white/[0.06] bg-white/[0.025] p-2 shadow-[0_12px_30px_rgba(0,0,0,0.14)]">
|
||||
<a href="{{ route('dashboard.comments.received') }}"
|
||||
class="inline-flex items-center gap-2 rounded-xl px-4 py-2 text-sm font-medium text-white/60 transition hover:bg-white/[0.05] hover:text-white">
|
||||
<i class="fa-solid fa-inbox"></i>
|
||||
Received
|
||||
</a>
|
||||
<a href="{{ route('messages.index') }}"
|
||||
class="inline-flex items-center gap-2 rounded-xl px-4 py-2 text-sm font-medium transition {{ request()->routeIs('messages.index', 'messages.show') ? 'bg-sky-500/15 text-sky-200 ring-1 ring-sky-400/20' : 'text-white/60 hover:bg-white/[0.05] hover:text-white' }}">
|
||||
<i class="fa-solid fa-envelope"></i>
|
||||
Messages
|
||||
</a>
|
||||
<a href="{{ route('dashboard.notifications') }}"
|
||||
class="inline-flex items-center gap-2 rounded-xl px-4 py-2 text-sm font-medium text-white/60 transition hover:bg-white/[0.05] hover:text-white">
|
||||
<i class="fa-solid fa-bell"></i>
|
||||
Notifications
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="messages-root"
|
||||
data-user-id='@json(auth()->id())'
|
||||
data-username='@json(auth()->user()?->username)'
|
||||
|
||||
@@ -76,6 +76,21 @@
|
||||
@endif
|
||||
</div>
|
||||
|
||||
@if (! empty($countries))
|
||||
<div>
|
||||
<x-input-label for="country_id" :value="__('Country')" />
|
||||
<select id="country_id" name="country_id" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
<option value="">{{ __('Choose country') }}</option>
|
||||
@foreach ($countries as $country)
|
||||
<option value="{{ $country['id'] }}" @selected((string) old('country_id', $selectedCountryId ?? $user->country_id) === (string) $country['id'])>
|
||||
{{ $country['flag_emoji'] ? $country['flag_emoji'].' ' : '' }}{{ $country['name'] }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
<x-input-error class="mt-2" :messages="$errors->get('country_id')" />
|
||||
</div>
|
||||
@endif
|
||||
|
||||
{{-- Posts & Feed Settings --}}
|
||||
<div class="border-t border-gray-200 pt-6">
|
||||
<h3 class="text-sm font-medium text-gray-900">{{ __('Posts & Feed') }}</h3>
|
||||
|
||||
@@ -1,44 +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">{{ $page_title ?? 'Followers' }}</h1>
|
||||
<p>Members who follow you</p>
|
||||
</header>
|
||||
</div>
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="icon-grid">
|
||||
@forelse($followers as $f)
|
||||
@php
|
||||
$icon = $f->icon ?? 'default.jpg';
|
||||
$uname = $f->uname ?? 'Unknown';
|
||||
$followerId = $f->user_id ?? null;
|
||||
@endphp
|
||||
|
||||
<div class="icon-flex">
|
||||
<div>
|
||||
<a href="/profile/{{ $followerId }}/{{ Str::slug($uname) }}">
|
||||
<h4>{{ $uname }}</h4>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<a href="/profile/{{ $followerId }}/{{ Str::slug($uname) }}">
|
||||
<img src="{{ \App\Support\AvatarUrl::forUser((int) $followerId, null, 50) }}" alt="{{ $uname }}">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
@empty
|
||||
<p>No followers yet.</p>
|
||||
@endforelse
|
||||
</div>
|
||||
|
||||
@if(method_exists($followers, 'links'))
|
||||
<div class="mt-3">{{ $followers->links() }}</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
@@ -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,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
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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
|
||||
@@ -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
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
Reference in New Issue
Block a user