@extends('frontend.layouts.master')
@section('meta_title', 'Resources || ' . $setting->app_name)
<!-- @section('meta_title', $seo_setting['course_page']['seo_title']) -->
<!-- @section('meta_description', $seo_setting['course_page']['seo_description']) -->

@section('contents')
<!-- breadcrumb-area -->
<x-frontend.breadcrumb :title="__('Resources')" :links="[['url' => route('home'), 'text' => __('Home')], ['url' => '', 'text' => __('Resources')]]" />
<!-- breadcrumb-area-end -->

<!-- all-courses -->
<section class="all-courses-area section-py-120 top-baseline">
    <div class="container position-relative">
        <div class="preloader-two d-none">
            <div class="loader-icon-two"><img src="{{ asset(Cache::get('setting')->preloader) }}" alt="Preloader"></div>
        </div>




        <div class="row">




























            <div class="col-md-12">
                <div class="card text-center shadow-sm p-3 mb-4 ">
                    <form method="GET" class="instructor__profile-form">
                        <div class="row">
                            <div class="col-md-10">
                                <div class="form-grp">
                                    <input type="text" name="search" value="{{ request()->get('search') }}" class="form-control" placeholder="Search">
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-grp float-end">
                                    <button type="submit" class="btn btn-primary">Search</button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>







        <div class="row">


            <div class="col-xl-12 col-lg-12">
                <div class="courses-top-wrap courses-top-wrap">
                    <div class="row align-items-center">
                        <div class="col-md-5">
                            <div class="courses-top-left">
                                <p>{{ __('Total') }} <span class="course-count">{{ $models->total() }}</span> {{ __('Resources found') }}
                                </p>
                            </div>
                        </div>
                        <div class="col-md-7">
                            <div class="d-flex justify-content-center align-items-center flex-wrap">
                                <div class="courses-top-right m-0 ms-md-auto" style="display: none;">
                                    <span class="sort-by">{{ __('Sort By') }}:</span>
                                    <div class="courses-top-right-select">
                                        <select name="orderby" class="orderby">
                                            <option value="desc">{{ __('Latest to Oldest') }}</option>
                                            <option value="asc">{{ __('Oldest to Latest') }}</option>
                                        </select>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
                <div class="tab-content" id="myTabContent">
                    <div class="tab-pane fade show active" id="grid" role="tabpanel"
                        aria-labelledby="grid-tab">
                        <div
                            class="course-holder row courses__grid-wrap row-cols-1 row-cols-xl-3 row-cols-lg-2 row-cols-md-2 row-cols-sm-1">
                            {{-- dynamic content will go here via ajax --}}



                            @forelse ($models as $jobs)
                            <div class="col-xxl-3 col-md-3 col-lg-3 col-xl-3">
                                <div class="courses__item shine__animate-item">
                                    <div class="courses__item-thumb">
                                        <a href="{{ route('resources.details', ['slug' => Str::slug($jobs->title),'id' => $jobs->id]) }}" class="shine__animate-link">
                                            <img src="{{ asset($jobs->thumb_image) }}" alt="img">
                                        </a>
                                    </div>
                                    <div class="courses__item-content">
                                        <ul class="courses__item-meta list-wrap">


                                        </ul>
                                        <h5 class="title">
                                            <a href="{{ route('resources.details', ['slug' => Str::slug($jobs->title),'id' => $jobs->id]) }}">
                                                {{ truncate($jobs->title, 50) }}
                                            </a>
                                        </h5>
                                        <p class="author md-2">
                                            {{ @$jobs->location }}
                                        </p>
                                        <p class="author">{{ __('By') }}
                                            <a href="{{ route('resources.details', ['slug' => Str::slug($jobs->title),'id' => $jobs->id]) }}">
                                                {{ @$jobs->company->company_name }}
                                            </a>
                                        </p>

                                    </div>
                                </div>
                            </div>
                            @empty
                            <div class="w-100">
                                <h6 class="text-center">{{ __('No Course Found!') }}</h6>
                            </div>
                            @endforelse


                        </div>

                        <div class="pagination-wrap">
                            <div class="pagination">
                                {{ $models->render() }}
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- all-courses-end -->
@endsection

@push('scripts')
<!-- <script src="{{ asset('frontend/js/default/internships-page.js') }}"></script> -->
<style>
    .breadcrumb__bg {
        padding: 20px 0;
    }

    .courses__item {
        min-height: 388px;
        max-height: 388px;
    }
    .section-py-120 {
        padding: 60px 0;
    }
    .btn.btn-primary:hover{
        color: #ffffff;
    }
</style>
@endpush