<div class="o-referencesView">
    <div class="l-grid">
        <div class="l-bisection">
            {{--@foreach($references as $key => $block)--}}
            @for($i = 0; $i < 3; $i++)
                @php $block = $references[$i]; @endphp
                <div class="l-bisection__item">
                    @if(isset($block))
                        <div class="c-references__block">
                            @include('site.components.icons.quoteMark')
                            <h4>{{$block->translation->text}}</h4>
                            <div class="c-references-block__image">
                                @if(isset($block->images) && sizeof($block->images) > 0)
                                    @if(explode('.', $block->images[0]->path)[1] == 'svg')
                                        @include('svg.mask', ['img' => str_replace('\\', '/',$block->images[0]->path), 'color'=> '#1A2233', 'vb_w' => 81, 'vb_h' => 101 , 'pathId' => 4])
                                    @else
                                        @include('svg.mask', ['img' => $block->images[0]->small_image_url, 'color'=> '#1A2233', 'vb_w' => 81, 'vb_h' => 101 , 'pathId' => 4])
                                    @endif
                                @else
                                    @include('svg.mask', ['color'=> '#1A2233', 'vb_w' => 81, 'vb_h' => 101 , 'pathId' => 4])
                                @endif
                            </div>
                            <div class="c-references-block__referee">
                                <p class="c-references-block__referee-name">{{$block->translation->name}}</p>
                                <p class="c-references-block__company-name">{{$block->translation->company_name}}</p>
                            </div>
                        </div>
                    @endif
                </div>
            @endfor
            {{--@endforeach--}}
            <div class="c-referencesView__static-item">
                <div class="c-servicesCtaBlock__blockData">
                    <svg class="c-servicesCtaBlock__right__bg" height="100%" viewBox="0 0 799 500" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
                        <defs>
                            <rect id="ctaBlock__right-path" x="0" y="-25%" height="150%" rx="20" width="100%"></rect>
                            <linearGradient x1="82.224348%" y1="50%" x2="15.7008608%" y2="50%"
                                            id="ctaBlock__right-linearGradient">
                                <stop stop-color="#699BFF" offset="0%"></stop>
                                <stop stop-color="#2F6CE6" offset="100%"></stop>
                            </linearGradient>
                        </defs>
                        <g id="Design" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                            <g id="Over-Ons" transform="translate(-240.000000, -4043.000000)">
                                <g id="Statistieken" transform="translate(240.000000, 4043.000000)">
                                    <g id="Oval-3-Copy"
                                       transform="translate(419.500000, 250.000000) rotate(-180.000000) translate(-419.500000, -250.000000) ">
                                        <mask id="ctaBlock__right-mask" fill="white">
                                            <use xlink:href="#ctaBlock__right-path"></use>
                                        </mask>
                                        <g id="Mask"></g>
                                        <ellipse id="Oval-3" fill="url(#ctaBlock__right-linearGradient)"
                                                 mask="url(#ctaBlock__right-mask)" cx="495.270833" cy="250"
                                                 rx="455.270833"
                                                 ry="456"></ellipse>
                                    </g>
                                </g>
                            </g>
                        </g>
                    </svg>
                    <p>{!! $component->getValueFromAttribute('Text') !!}</p>
                    <h2>{!! $component->getValueFromAttribute('Title') !!}</h2>
                    <a href="{!! $component->getValueFromAttribute('linkAddress') !!}">
                        @include('site.components.button', ['buttonText' => $component->getValueFromAttribute('linkText'), 'modifiers' => ['icon']])
                    </a>
                </div>

                <div class="paginate">
                    @include('site.partials.posts_pagination7', ['paginator' => $references])
                </div>
            </div>
        </div>
    </div>
</div>