change style of button

This commit is contained in:
I-Fun
2026-04-05 09:56:29 +07:00
parent 5656dc1f3a
commit 8b5992b7ce
14 changed files with 1466 additions and 1394 deletions

View File

@@ -11,7 +11,7 @@
<div class="flex items-center justify-between gap-2 mb-3">
<div class="flex items-center gap-2">
<a href="{{ route('clients.create') }}" class="btn-sakura text-sm">+ Add</a>
<a href="{{ route('clients.create') }}" class="btn-sakura text-sm">+ Add Client</a>
@if(request('category') || request('status'))
<a href="{{ route('clients.index') }}"
class="text-xs px-3 py-2 rounded-full border border-gray-200 text-gray-500 hover:bg-gray-50 flex items-center gap-1">
@@ -37,39 +37,42 @@
<div x-show="open" x-transition.duration.150ms>
<form method="GET" action="{{ route('clients.index') }}" id="filter-form" class="cat-card p-3 mb-4">
{{-- Row 1: search + dropdowns --}}
<div class="flex flex-col sm:flex-row sm:items-center gap-2">
{{-- Search (fills remaining space on desktop) --}}
<div class="relative flex-1 min-w-0">
<span
class="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 text-sm pointer-events-none">🔍</span>
<input type="text" placeholder="Filter by name…" class="input-soft pl-9 text-sm py-2 w-full"
<div class="grid grid-cols-1 sm:grid-cols-12 gap-3 items-center">
{{-- Search --}}
<div class="relative sm:col-span-5 lg:col-span-6 w-full">
<span class="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 text-sm pointer-events-none"></span>
<input type="text" placeholder="🔍 Filter by name…" class="input-soft pl-9 text-sm py-2 w-full"
oninput="filterClients(this.value)" id="search-input">
</div>
{{-- Category dropdown --}}
<select name="category" class="input-soft text-sm py-2 sm:w-48 shrink-0" onchange="this.form.submit()">
<option value="">All Categories</option>
@foreach($categories as $parent)
<option value="{{ $parent->id }}" {{ request('category') == $parent->id ? 'selected' : '' }}>
{{ $parent->icon }} {{ $parent->name }}
</option>
@foreach($parent->children as $child)
<option value="{{ $child->id }}" {{ request('category') == $child->id ? 'selected' : '' }}>
&nbsp;&nbsp;↳ {{ $child->name }}
<div class="sm:col-span-4 lg:col-span-3 w-full">
<select name="category" class="input-soft text-sm py-2 w-full" onchange="this.form.submit()">
<option value="">All Categories</option>
@foreach($categories as $parent)
<option value="{{ $parent->id }}" {{ request('category') == $parent->id ? 'selected' : '' }}>
{{ $parent->icon }} {{ $parent->name }}
</option>
@foreach($parent->children as $child)
<option value="{{ $child->id }}" {{ request('category') == $child->id ? 'selected' : '' }}>
&nbsp;&nbsp;↳ {{ $child->name }}
</option>
@endforeach
@endforeach
@endforeach
</select>
</select>
</div>
{{-- Status dropdown --}}
<select name="status" class="input-soft text-sm py-2 sm:w-36 shrink-0" onchange="this.form.submit()">
<option value="">All Statuses</option>
@foreach($statuses as $s)
<option value="{{ $s->value }}" {{ request('status') === $s->value ? 'selected' : '' }}>
{{ $s->label() }}
</option>
@endforeach
</select>
<div class="sm:col-span-3 lg:col-span-3 w-full">
<select name="status" class="input-soft text-sm py-2 w-full" onchange="this.form.submit()">
<option value="">All Statuses</option>
@foreach($statuses as $s)
<option value="{{ $s->value }}" {{ request('status') === $s->value ? 'selected' : '' }}>
{{ $s->label() }}
</option>
@endforeach
</select>
</div>
</div>
</form>