<section class="photo-header">
    <div class="grid-row">
        <div class="text-wrapper">
            @include('site.partials.breadcrumb')
            <h1>{{$model->translation->name}}</h1>
        </div>

        @if(isset($model->images))
            <div id="header-image-slider">
                <div class="placeholder">
                    @foreach($model->images as $key => $image)
                        <figure class="image @if($loop->first) active @endif" data-order="{{$key}}">
                            @foreach(['large', 'medium', 'small'] as $size)
                                <span class="{{$size}} size"
                                      style="background-image: url('{{ $image->{$size.'_image_url'} }}');"></span>
                            @endforeach
                        </figure>
                    @endforeach
                </div>
                <div class="slider-navigation-labels">
                    @if(isset($model->code_name))
                        <div class="caption">
                            @foreach($model->images as $key => $image)
                                <p class="@if($loop->first) active @endif"
                                   data-order="{{$key}}">
                                    @if(\Lang::has('site/caption.'.\App::getSite()->slug.'.'.$model->code_name.'.'.$key))
                                        @lang('site/caption.'.\App::getSite()->slug.'.'.$model->code_name.'.'.$key)
                                    @endif
                                </p>
                            @endforeach
                        </div>
                    @endif
                    @if($model->images->count() > 1)
                        <div class="navigation">
                            @foreach($model->images as $key => $image)
                                <span class="@if($loop->first) active @endif" data-order="{{$key}}"></span>
                            @endforeach
                        </div>
                    @endif
                </div>
            </div>
        @endif

    </div>
</section>