Files
jobifygarden/resources/views/components/job-card.blade.php
T

83 lines
4.2 KiB
PHP
Raw Normal View History

2026-04-03 20:33:24 +03:00
@props(['job'])
<div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6 hover:shadow-md transition-shadow duration-200">
<div class="flex justify-between items-start mb-3">
<div class="flex-1">
<h3 class="text-lg font-semibold text-gray-900 mb-1">
2026-04-04 18:19:34 +03:00
<a href="{{ route('jobs.show', $job) }}" class="hover:text-emerald-600">
2026-04-03 20:33:24 +03:00
{{ $job->title }}
</a>
</h3>
<p class="text-gray-700 font-medium">{{ $job->company }}</p>
</div>
@if($job->remote_allowed)
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-emerald-100 text-emerald-800">
Remote
</span>
@endif
</div>
<div class="flex flex-wrap gap-3 text-sm text-gray-600 mb-4">
@if($job->location)
<div class="flex items-center">
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"></path>
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"></path>
</svg>
{{ $job->location }}
</div>
@endif
@if($job->job_type)
<div class="flex items-center">
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 13.255A23.931 23.931 0 0112 15c-3.183 0-6.22-.62-9-1.745M16 6V4a2 2 0 00-2-2h-4a2 2 0 00-2 2v2m4 6h.01M5 20h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
</svg>
{{ ucfirst(str_replace('_', ' ', $job->job_type)) }}
</div>
@endif
@if($job->experience_level)
<div class="flex items-center">
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4M7.835 4.697a3.42 3.42 0 001.946-.806 3.42 3.42 0 014.438 0 3.42 3.42 0 001.946.806 3.42 3.42 0 013.138 3.138 3.42 3.42 0 00.806 1.946 3.42 3.42 0 010 4.438 3.42 3.42 0 00-.806 1.946 3.42 3.42 0 01-3.138 3.138 3.42 3.42 0 00-1.946.806 3.42 3.42 0 01-4.438 0 3.42 3.42 0 00-1.946-.806 3.42 3.42 0 01-3.138-3.138 3.42 3.42 0 00-.806-1.946 3.42 3.42 0 010-4.438 3.42 3.42 0 00.806-1.946 3.42 3.42 0 013.138-3.138z"></path>
</svg>
{{ ucfirst(str_replace('_', ' ', $job->experience_level)) }}
</div>
@endif
</div>
@if($job->salary_min || $job->salary_max)
<div class="mb-4">
<span class="text-sm font-semibold text-emerald-600">
@if($job->salary_min && $job->salary_max)
{{ $job->salary_currency ?? '$' }}{{ number_format($job->salary_min) }} - {{ $job->salary_currency ?? '$' }}{{ number_format($job->salary_max) }}
@elseif($job->salary_min)
{{ $job->salary_currency ?? '$' }}{{ number_format($job->salary_min) }}+
@elseif($job->salary_max)
Up to {{ $job->salary_currency ?? '$' }}{{ number_format($job->salary_max) }}
@endif
</span>
</div>
@endif
@if($job->description)
<p class="text-gray-600 text-sm mb-4 line-clamp-2">
{{ Str::limit(strip_tags($job->description), 150) }}
</p>
@endif
<div class="flex justify-between items-center pt-4 border-t border-gray-100">
<span class="text-xs text-gray-500">
Posted {{ $job->posted_at ? $job->posted_at->diffForHumans() : $job->created_at->diffForHumans() }}
</span>
2026-04-04 18:19:34 +03:00
<a href="{{ route('jobs.show', $job) }}"
2026-04-03 20:33:24 +03:00
class="inline-flex items-center px-4 py-2 bg-emerald-600 hover:bg-emerald-700 text-white text-sm font-medium rounded-md transition-colors duration-200">
View Details
<svg class="ml-2 w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
</svg>
</a>
</div>
</div>