@extends('site.master')

@section('title', $page->translation->meta_title)
@section('meta_description', $page->translation->meta_description)

@section('content')

    <div class="c-body  l-contain">

        @if(1 == 1)

            <div class="o-block">
                <div class="u-max-width-1000  u-margin-auto">
                    @include('site.components.clientQuote', [
                        'clientQuoteImage' => collect(),
                        'clientQuoteDescription' => 'Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.',
                        'clientQuoteName' => 'Sara Lamberts',
                        'clientQuoteFunction' => 'Office Supply Manager',
                    ])
                </div>
            </div>

            <div class="o-block">
                <div class="u-owl">
                    <h1>This is heading 1</h1>
                    <h2>This is heading 2</h2>
                    <h3>This is heading 3</h3>
                    <h4>This is heading 4</h4>
                    <h5>This is heading 5</h5>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus accusantium commodi
                        doloremque
                        fugiat, id nulla sapiente vel. Ab accusamus adipisci architecto consectetur culpa debitis dolor
                        dolorum
                        est eum explicabo laborum libero natus non praesentium quaerat quam reiciendis rem sapiente sunt
                        tempora
                        temporibus totam vitae, voluptatum. Consequatur consequuntur cumque deserunt repellat.
                    </p>
                    <ul>
                        <li>Kolimus hic ipsum iure molestias necessitatibus sequi sint tempora?</li>
                        <li>Otque, sit, soluta! Blanditiis eveniet laborum maxime nihil saepe tempore.</li>
                        <li>Morporis dolorem eum itaque necessitatibus neque obcaecati omnis.</li>
                        <li>Menim fugiat minus nostrum quam quis ullam, veritatis!</li>
                        <li>Abore mollitia recusandae sapiente sed. Explicabo, hic.</li>
                    </ul>
                </div>
            </div>

            <div class="o-block">
                @include('site.organisms.discoverRow')
            </div>

            {{--<div class="o-block">--}}
            {{--<div class="">--}}
            {{--@include('site.components.form.switch')--}}
            {{--</div>--}}
            {{--</div>--}}

            {{--<div class="o-block">--}}
            {{--<div style="background: #f7f7f7; ">--}}

            {{--@include('site.components.icons.arrow')--}}
            {{--@include('site.components.icons.clock')--}}
            {{--@include('site.components.icons.divider')--}}
            {{--@include('site.components.icons.enterprising')--}}
            {{--@include('site.components.icons.facebook')--}}
            {{--@include('site.components.icons.komma')--}}
            {{--@include('site.components.icons.linkedin')--}}
            {{--@include('site.components.icons.logo')--}}
            {{--@include('site.components.icons.logo--inverted')--}}
            {{--@include('site.components.icons.next')--}}
            {{--@include('site.components.icons.quoteMark')--}}
            {{--@include('site.components.icons.teaching')--}}

            {{--</div>--}}
            {{--</div>--}}

{{--            <div class="o-block">--}}
{{--                    @include('site.components.usp')--}}
{{--            </div>--}}
{{--            <div class="o-block">--}}
{{--                    @include('site.components.usp', ['uspIcon' => 2])--}}
{{--            </div>--}}
{{--            <div class="o-block">--}}
{{--                    @include('site.components.usp', ['uspIcon' => 3])--}}
{{--            </div>--}}
{{--            <div class="o-block">--}}
{{--                    @include('site.components.usp', ['uspIcon' => 4])--}}
{{--            </div>--}}
{{--            <div class="o-block">--}}
{{--                    @include('site.components.usp', ['uspIcon' => 5])--}}
{{--            </div>--}}

{{--            <div class="o-block">--}}
{{--                @include('site.organisms.uspGrid')--}}
{{--            </div>--}}

            <div class="o-block">
                    @include('site.components.button', ['isButton' => true])
                    @include('site.components.button', ['isButton' => true, 'modifiers' => ['icon']])
            </div>

            <div class="o-block">
                    @include('site.components.button', ['modifiers' => ['green']])
                    @include('site.components.button', ['modifiers' => ['green', 'icon']])
            </div>


            <div class="o-block">
                    @include('site.components.button', ['modifiers' => ['ghost']])
                    @include('site.components.button', ['modifiers' => ['ghost', 'icon']])
            </div>

            <div class="o-block">
                    @include('site.components.textButton', ['isButton' => true])
                    @include('site.components.textButton', ['isButton' => true, 'modifiers' => ['icon']])
            </div>

            {{--<div class="o-block">--}}
            {{--<div>--}}
            {{--@include('site.components.cta.cta')--}}
            {{--</div>--}}
            {{--</div>--}}


            <div class="o-block-bg">
                <div class="l-matrix  l-matrix--dense">
                    <div class="l-matrix__item">
                        @include('site.components.card')
                    </div>
                    <div class="l-matrix__item">
                        @include('site.components.card')
                    </div>
                    <div class="l-matrix__item">
                        @include('site.components.card')
                    </div>
                    <div class="l-matrix__item">
                        @include('site.components.card')
                    </div>
                    <div class="l-matrix__item">
                        @include('site.components.card')
                    </div>
                </div>
            </div>


            <div class="o-block">
                <div class="u-margin-auto u-max-width-720 l-split">
                    <div class="l-split__column">
                        @include('site.components.author', ['contactPerson' => 'henk'])
                    </div>
                    <div class="l-split__column">
                        @include('site.components.author', ['contactPerson' => 'carla'])
                    </div>
                </div>
            </div>

            <div class="o-block">
                <div class="u-margin-auto u-max-width-720 l-split">
                    <div class="l-split__column">
                        @include('site.components.author', ['modifiers' => 'with-image', 'contactPerson' => 'henk'])
                    </div>
                    <div class="l-split__column">
                        @include('site.components.author', ['modifiers' => 'with-image', 'contactPerson' => 'carla'])
                    </div>
                </div>
            </div>

            <div class="o-block">
                <div class="u-max-width-1000  u-margin-auto">
                    @include('site.components.quoteBox', ['modifiers' => 'rule', 'quoteDescription' => "Wij blijven onze cursisten iedere keer weer verrassen. Alle zintuigen prikkelen. Daar gaat het om."])
                </div>
            </div>

            <div class="o-block-bg">
                <div class="u-max-width-720  u-margin-auto">
                    @include('site.components.quoteBox')
                </div>
            </div>

            <div class="o-block">
                <div class="u-max-width-720  u-margin-auto">
                    @include('site.components.person', ['contactPerson' => 'henk'])
                </div>
            </div>

            <div class="o-block-bg">
                <div class="u-max-width-720  u-margin-auto">
                    @include('site.components.person', ['isBusinessCard' => true, 'contactPerson' => 'henk'])
                </div>
            </div>

            <div class="o-block">
                <div class="u-max-width-720  u-margin-auto">
                    @include('site.components.personalCallout', ['smallCallout' => true, 'contactPerson' => 'carla'])
                </div>
            </div>

            <div class="o-block-bg">
                <div class="u-max-width-720  u-margin-auto">
                    @include('site.components.personalCallout', ['contactPerson' => 'carla'])
                </div>
            </div>

            <div class="o-block">
                <div class="u-max-width-720  u-margin-auto">
                    @include('site.components.personalCallout', ['contactPerson' => 'carla', 'showButton' => true])
                </div>
            </div>

            <div class="o-block-bg">
                @include('site.organisms.calloutBar', ['showPhoneButton' => true])
            </div>

        @endif

    </div>

    <div class="home__force-scroll"></div>


@endsection