feat: increase gallery grid from 4 to 5 columns per row on desktopfeat: increase gallery grid from 4 to 5 columns per row on desktop

resources/views/search/index.blade.php

@@ -0,0 +1,78 @@
+@extends('layouts.nova')
+
+@push('head')
+<meta name="robots" content="noindex,follow">
+<meta name="description" content="Search Skinbase artworks, photography, wallpapers and skins.">
+@endpush
+
+@section('content')
+<div class="px-6 py-8 md:px-10" id="search-page" data-q="{{ $q ?? '' }}">
+
+    {{-- Search header --}}
+    <div class="mb-8 max-w-2xl">
+        <h1 class="text-2xl font-bold text-white mb-2">Search</h1>
+        <form action="/search" method="GET" class="relative" role="search">
+            <input
+                type="search"
+                name="q"
+                value="{{ $q ?? '' }}"
+                placeholder="Search artworks, artists, tags…"
+                autofocus
+                class="w-full bg-white/[0.05] border border-white/10 rounded-xl py-3 pl-4 pr-12 text-white placeholder-neutral-500 outline-none focus:border-sky-500 transition-colors"
+            >
+            <button type="submit" class="absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 hover:text-sky-400 transition-colors">
+                <svg class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-4.35-4.35M17 11A6 6 0 1 1 5 11a6 6 0 0 1 12 0z"/></svg>
+            </button>
+        </form>
+    </div>
+
+    @if(isset($q) && $q !== '')
+        {{-- Sort + filter bar --}}
+        <div class="flex flex-wrap items-center gap-3 mb-6">
+            <span class="text-sm text-neutral-400">Sort by:</span>
+            @foreach(['latest' => 'Newest', 'popular' => 'Most viewed', 'likes' => 'Most liked', 'downloads' => 'Most downloaded'] as $key => $label)
+                <a href="{{ request()->fullUrlWithQuery(['sort' => $key]) }}"
+                   class="px-3 py-1.5 rounded-lg text-xs font-medium transition-colors
+                          {{ ($sort ?? 'latest') === $key ? 'bg-sky-500 text-white' : 'bg-white/5 text-neutral-400 hover:bg-white/10 hover:text-white' }}">
+                    {{ $label }}
+                </a>
+            @endforeach
+
+            @if($artworks->total() > 0)
+                <span class="ml-auto text-sm text-neutral-500">
+                    {{ number_format($artworks->total()) }} {{ Str::plural('result', $artworks->total()) }}
+                </span>
+            @endif
+        </div>
+
+        {{-- Results grid --}}
+        @if($artworks->isEmpty())
+            <div class="rounded-xl bg-white/[0.03] border border-white/[0.06] p-14 text-center">
+                <p class="text-neutral-400 text-lg mb-2">No results for <span class="text-white">"{{ $q }}"</span></p>
+                <p class="text-sm text-neutral-500">Try a different keyword or browse by <a href="/browse" class="text-sky-400 hover:underline">category</a>.</p>
+            </div>
+        @else
+            <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-5">
+                @foreach($artworks as $artwork)
+                    <x-artwork-card :art="$artwork" />
+                @endforeach
+            </div>
+
+            <div class="flex justify-center mt-10">
+                {{ $artworks->appends(request()->query())->links('pagination::tailwind') }}
+            </div>
+        @endif
+    @else
+        {{-- No query: show popular --}}
+        <div class="mb-4 flex items-center gap-2">
+            <span class="text-sm font-semibold text-white/70 uppercase tracking-wide">Popular right now</span>
+        </div>
+        <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-5">
+            @foreach($popular as $artwork)
+                <x-artwork-card :art="$artwork" />
+            @endforeach
+        </div>
+    @endif
+
+</div>
+@endsection