@extends('layouts.front')

@section('header-text')
    <h1 class="hidden-sm-down">{{ ucwords($job->title) }}</h1>
    <h5 class="hidden-sm-down"><i class="icon-map-pin"></i> {{ ucwords($job->location->location) }}</h5>
@endsection

@section('content')

    <div class="container">
        <div class="row">


            <div class="col-md-12 fs-12 pt-50 pb-10 bb-1 mb-20">
                <a class="text-dark"
                   href="{{ route('jobs.jobOpenings', $job->company->career_page_link) }}">@lang('modules.front.jobOpenings')</a> &raquo; <span
                        class="theme-color">{{ ucwords($job->title) }}</span>
            </div>


            <div class="col-md-8">
                <div class="row gap-y">
                    <div class="col-md-12">
                        <h2>{{ ucwords($job->title) }}</h2>
                        @if($job->company->show_in_frontend == 'true')
                            <small class="company-title">@lang('app.by') {{ ucwords($job->company->company_name) }}</small>
                        @endif
                        <p>{{ ucwords($job->category->name) }}</p>

                        @if(count($job->skills) > 0)
                            <h6>@lang('menu.skills')</h6>
                            <div class="gap-multiline-items-1">
                                @foreach($job->skills as $skill)
                                    <span class="badge badge-secondary">{{ $skill->skill->name }}</span>
                                @endforeach
                            </div>
                        @endif

                        <h4 class="theme-color mt-20">@lang('modules.jobs.jobDescription')</h4>

                        <div>
                            {!! $job->job_description !!}
                        </div>

                        <h4 class="theme-color mt-20">@lang('modules.jobs.jobRequirement')</h4>

                        <div>
                            {!! $job->job_requirement !!}
                        </div>

                        <div class="my-30 text-center">
                            <a class="btn btn-lg btn-primary theme-background"
                               href="{{ route('jobs.jobApply', [$job->company->career_page_link, $job->slug]) }}">@lang('modules.front.applyForJob')</a>
                        </div>

                    </div>

                </div>

            </div>

            <div class="col-md-4 hidden-sm-down">
                <div class="sidebar">

                    <a class="btn btn-block btn-primary theme-background my-10"
                       href="{{ route('jobs.jobApply', [$job->company->career_page_link, $job->slug]) }}">@lang('modules.front.applyForJob')</a>

                    <div class="b-1 border-light mt-20 text-center">
                        <span class="fs-12 fw-600">@lang('modules.front.shareJob')</span>

                        <div class="social social-boxed social-colored social-cycling text-center my-10">
                            <a class="social-linkedin"
                            href="https://www.linkedin.com/shareArticle?mini=true&url={{ route('jobs.jobDetail', [$job->company->career_page_link, $job->slug]) }}&title={{ urlencode(ucwords($job->title)) }}&source=LinkedIn"
                            ><i class="fa fa-linkedin"></i></a>
                            <a class="social-facebook"
                               href="https://www.facebook.com/sharer/sharer.php?u={{ route('jobs.jobDetail', [$job->company->career_page_link, $job->slug]) }}"
                            ><i class="fa fa-facebook"></i></a>
                            <a class="social-twitter"
                               href="https://twitter.com/intent/tweet?status={{ route('jobs.jobDetail', [$job->company->career_page_link, $job->slug]) }}"
                            ><i class="fa fa-twitter"></i></a>
                            <a class="social-gplus"
                               href="https://plus.google.com/share?url={{ route('jobs.jobDetail', [$job->company->career_page_link, $job->slug]) }}"
                            ><i class="fa fa-google-plus"></i></a>
                        </div>
                    </div>
                    @if($company->linkedin == 'enable' && $linkedinGlobal->status == 'enable')
                        <a class="my-10 applyWithLinkedin btn btn-block btn-primary "
                       href="{{ route('jobs.linkedinRedirect', 'linkedin') }}"><i class="fa fa-linkedin-square"></i> @lang('modules.front.linkedinSignin')</a>
                    @endif
                </div>
            </div>

        </div>
    </div>
    {{--Ajax Modal Start for--}}
    <div class="modal fade bs-modal-md in" id="applyLinkedin" role="dialog" aria-labelledby="myModalLabel"
         aria-hidden="true">
        <div class="modal-dialog modal-lg" id="modal-data-application">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                    <span class="caption-subject font-red-sunglo bold uppercase" id="modelHeading"></span>
                </div>
                <div class="modal-body">
                    Loading...
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn default" data-dismiss="modal">Close</button>
                    <button type="button" class="btn blue">Save changes</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
    {{--Ajax Modal Ends--}}
@endsection