@extends('layouts.master', ['view' => 'news-detail'])

@section('meta')
    <title>{{ $page->translation->name }} | {{$links->jobs->name}}</title>
{{--    <meta name="description" content="{{ $page->translation->description }}">--}}
@endsection

@section('editable_content')
    <div class="image-wrapper">

        <div class="content-placeholder">


            <div class="grid-row">
                <div class="grid-col">
                    @include('layouts.partials.breadcrumb')
                </div>
            </div>
            <div class="grid-row top">
                {{-- Impression block --}}


                {{-- Title content block --}}
                <div class="grid-col col-4 offset-1">
                    <h1>{{ $page->translation->name }}</h1>
                    <a href="/vacatures" class="back-to-projects"><span class="icon-grid-view"></span> Terug naar
                        overzicht</a>
                </div>
            </div>
            <div class="grid-row main row">
                <div class="job-description grid-col col-6 offset-1 ">
                    <h2>Omschrijving</h2>
                    <p>{{ $page->translation->description }}</p>
                </div>
                <div class="grid-col col-4 offset-1 pull-right job-imgholder">
                    @if(isset($page->images[0]))
{{--                        <img class="large" alt="impression image"--}}
{{--                             src="{{$page->images[0]->large_image_url}}"/>--}}
                        <figure class="large"
                                style="background-image: url('{{$page->images[0]->large_image_url}}');">
                        </figure>
                    @endif
                </div>
            </div>

            <div class="grid-row bottom row">
                <div class="grid-col col-12 reference-linkholder">
                    <a href="/vacatures">Overzicht vacatures</a>
                    <br/>
                    <span class="yellowline"></span>
                </div>
            </div>

        </div>
        @include("layouts.partials.callToActionContact", ['name' => 'Wim Verhoeven', 'jobtitle' => 'Bedrijfsleider', 'phone' => '06 53 76 04 49', 'phoneLink' => '0031653760449', 'img' => '/img/personeel/Wim.jpg'])
    </div>
@endsection

@section('extra-js')
    <script src="/js/jquery.touchSwipe.min.js"></script>
    <script src="/js/overviewSlider.js"></script>
@endsection