fixes
This commit is contained in:
Doar Mihai
+104
-16
@@ -37,35 +37,123 @@
|
||||
<!-- Hero Section -->
|
||||
<div class="bg-gradient-to-r from-emerald-600 to-emerald-500">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16 sm:py-24">
|
||||
<div class="text-center">
|
||||
<div class="text-center mb-10">
|
||||
<h1 class="text-4xl sm:text-5xl lg:text-6xl font-bold text-white mb-6">
|
||||
Find Your Dream Job
|
||||
</h1>
|
||||
<p class="text-xl text-emerald-50 mb-8 max-w-2xl mx-auto">
|
||||
<p class="text-xl text-emerald-50 max-w-2xl mx-auto">
|
||||
Search through thousands of job listings from multiple sources. Your next career opportunity is just a search away.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Search Bar -->
|
||||
<div class="max-w-3xl mx-auto">
|
||||
<form action="{{ route('jobs.index') }}" method="GET" class="flex flex-col sm:flex-row gap-2">
|
||||
<div class="flex-1">
|
||||
<input type="text"
|
||||
name="keywords"
|
||||
placeholder="Job title, keywords, or company"
|
||||
class="w-full px-4 py-3 rounded-lg border-0 focus:ring-2 focus:ring-emerald-600 text-gray-900 placeholder-gray-500">
|
||||
<!-- Advanced Search Form -->
|
||||
<div class="max-w-5xl mx-auto">
|
||||
<form action="{{ route('jobs.index') }}" method="GET" class="bg-white rounded-xl shadow-2xl p-6 space-y-4">
|
||||
<!-- Main Search Field -->
|
||||
<div>
|
||||
<input type="text"
|
||||
name="keywords"
|
||||
placeholder="Job title, keywords, or company..."
|
||||
class="w-full px-4 py-4 text-lg rounded-lg border border-gray-300 focus:ring-2 focus:ring-emerald-500 focus:border-emerald-500 text-gray-900 placeholder-gray-500">
|
||||
</div>
|
||||
|
||||
<!-- Filter Grid -->
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3">
|
||||
<!-- Category -->
|
||||
<div>
|
||||
<select name="category_id"
|
||||
class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-emerald-500 focus:border-emerald-500 text-gray-700 bg-white">
|
||||
<option value="">All Categories</option>
|
||||
@foreach($categories as $category)
|
||||
<option value="{{ $category->id }}">{{ $category->name }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
|
||||
<!-- Location -->
|
||||
<div>
|
||||
<input type="text"
|
||||
name="location"
|
||||
placeholder="Location"
|
||||
class="w-full px-4 py-3 rounded-lg border-0 focus:ring-2 focus:ring-emerald-600 text-gray-900 placeholder-gray-500">
|
||||
class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-emerald-500 focus:border-emerald-500 text-gray-700 placeholder-gray-500">
|
||||
</div>
|
||||
|
||||
<!-- Job Type -->
|
||||
<div>
|
||||
<select name="job_type"
|
||||
class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-emerald-500 focus:border-emerald-500 text-gray-700 bg-white">
|
||||
<option value="">All Job Types</option>
|
||||
@foreach($jobTypes as $type)
|
||||
<option value="{{ $type }}">{{ ucfirst(str_replace('_', ' ', $type)) }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- Experience Level -->
|
||||
<div>
|
||||
<select name="experience_level"
|
||||
class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-emerald-500 focus:border-emerald-500 text-gray-700 bg-white">
|
||||
<option value="">All Experience Levels</option>
|
||||
@foreach($experienceLevels as $level)
|
||||
<option value="{{ $level }}">{{ ucfirst($level) }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Additional Filters Row -->
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3">
|
||||
<!-- Remote -->
|
||||
<div>
|
||||
<select name="remote"
|
||||
class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-emerald-500 focus:border-emerald-500 text-gray-700 bg-white">
|
||||
<option value="">Remote/On-site</option>
|
||||
<option value="1">Remote Only</option>
|
||||
<option value="0">On-site Only</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- Posted Within -->
|
||||
<div>
|
||||
<select name="posted_within"
|
||||
class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-emerald-500 focus:border-emerald-500 text-gray-700 bg-white">
|
||||
<option value="">Any Time</option>
|
||||
<option value="1">Last 24 hours</option>
|
||||
<option value="7">Last 7 days</option>
|
||||
<option value="30">Last 30 days</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- Salary Min -->
|
||||
<div>
|
||||
<input type="number"
|
||||
name="salary_min"
|
||||
placeholder="Min Salary"
|
||||
class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-emerald-500 focus:border-emerald-500 text-gray-700 placeholder-gray-500">
|
||||
</div>
|
||||
|
||||
<!-- Salary Max -->
|
||||
<div>
|
||||
<input type="number"
|
||||
name="salary_max"
|
||||
placeholder="Max Salary"
|
||||
class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-emerald-500 focus:border-emerald-500 text-gray-700 placeholder-gray-500">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Search Button -->
|
||||
<div class="flex justify-center pt-2">
|
||||
<button type="submit"
|
||||
class="px-8 py-3 bg-emerald-800 hover:bg-emerald-900 text-white font-semibold rounded-lg transition-colors duration-200">
|
||||
Search Jobs
|
||||
class="px-12 py-4 bg-emerald-600 hover:bg-emerald-700 text-white text-lg font-semibold rounded-lg transition-colors duration-200 shadow-lg hover:shadow-xl">
|
||||
<span class="flex items-center">
|
||||
<svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path>
|
||||
</svg>
|
||||
Search Jobs
|
||||
</span>
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user