@extends('site.master', ['view' => 'job-show'])

@section('title', $job->translation->name . ' | ' .$page->translation->meta_title)
@section('meta_description', $page->translation->meta_description)

@section('content')
    <section class="content">

        <section class="grid-row full-row intro">
            <div class="grid-col">
                <div class="grid-row">
                    <div class="grid-col left">
                        <div class="image">
                            <figure>
                                @if(isset($job->images) && $job->images->count() != 0)
                                    <img alt="impression" class="large"
                                         src="{{$job->images->first()->large_image_url}}"/>
                                @endif
                            </figure>
                        </div>
                        <div class="red_triangle"></div>
                        <a class="mouse scroll-to-target" href="#content">
                            <svg width="22px" height="36px" viewBox="0 0 22 36" version="1.1"
                                 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
                                <!-- Generator: Sketch 50.2 (55047) - http://www.bohemiancoding.com/sketch -->
                                <title>mouse_white</title>
                                <desc>Created with Sketch.</desc>
                                <defs></defs>
                                <g id="mouse_white" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"
                                   stroke-linecap="round" stroke-linejoin="round">
                                    <g id="Icon/Mouse" stroke="#FFFFFF" stroke-width="1.5">
                                        <path d="M10.9014,35.3115 C5.3184,35.3115 0.7504,30.7445 0.7504,25.1615 L0.7504,10.9015 C0.7504,5.3185 5.3184,0.7495 10.9014,0.7495 C16.4844,0.7495 21.0514,5.3185 21.0514,10.9015 L21.0514,25.1615 C21.0514,30.7445 16.4844,35.3115 10.9014,35.3115 Z"
                                              id="Stroke-1"></path>
                                        <path d="M10.9014,7.6455 L10.9014,13.3325" id="Stroke-3"></path>
                                    </g>
                                </g>
                            </svg>
                            <span class="vertical-line"></span>
                            <span class="text">Naar beneden</span>
                        </a>
                    </div>
                    <div class="grid-col right">
                        <h1>{{$page->translation->name}}</h1>
                        <h2>{{$job->translation->name}}</h2>

                        <div class="kms-content">
                            <p>{!! nl2br($job->translation->meta_description) !!}</p>
                        </div>

                        <a class="button left-arrow blue" href="/{{$links->{$page->code_name}->route}}">
                            Bekijk meer vacatures
                        </a>

                        <div class="diagonal-line blue second"></div>
                        <div class="diagonal-line blue third"></div>
                    </div>
                </div>
            </div>
        </section>


        <section class="grid-row full-row job-detail" id="content">
            <div class="grid-col">
                <div class="grid-row">
                    <div class="grid-col kms-content">
                        {!! $job->translation->description !!}
                    </div>
                </div>
            </div>
        </section>

        <section class="job-footer">
            <div class="grid-row">
                <div class="top-triangle">@include('svg.triangle_filled')</div>
                <h2>Kom jij ons team versterken?</h2>
                <div class="buttons">
                    <a class="button phone filled" href="tel:{{ \Config::get('business.phone_call') }}">
                        Ja! Snel bellen
                    </a>
                    <a class="button arrow blue filled" href="/{{$links->contact->route}}">
                        Contact opnemen
                    </a>
                </div>
            </div>
        </section>


@endsection