@extends('layouts.master')

@section('editable_content')

    <div class="header-image streamer"
         @if(isset($page->content->home_slogan) && $page->content->home_slogan->images->count() != 0) style="background-image: url('{{$page->content->home_slogan->images->first()->large_image_url}}');" @endif>
        <div class="content-container">
            @if(isset($page->content->home_slogan))

            @else
                <h1>Voeg een tekstblok toe met<br/>code_name 'home_slogan'</h1>
                <p>Titel + Omschrijving + 1 afbeelding. In de titel kan eventueel &lt;br/&gt; gezet<br/>worden om een
                    enter te maken.
                </p>
            @endif
        </div>
    </div>

    <div class="intro-row">
        <div class="content-container">

            {{--@foreach($page->content as $key => $block)
                {{($block->translation->description)}}<br/>
            @endforeach--}}


            <div class="intro-block">
                @if(isset($page->content->home_introduction))
                    <h1>{{ $page->content->home_slogan->translation->name }}</h1>
                    <div class="slogan">
                        {{ $page->content->home_slogan->translation->description }}
                    </div>

                    {{ $page->content->home_introduction->translation->description }}
                @else
                    <h3>Voeg een tekstblok toe met code_name 'home_introduction'</h3>
                    <p>Titel + omschrijving</p>
                @endif

                {{--<div class="fb-wrapper">--}}
                {{--<iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2FEuropese-Jeugdsportdagen-469371073117233&tabs=timeline&width=340&height=500&small_header=false&adapt_container_width=true&hide_cover=true&show_facepile=false&appId=230893793944463" height="500" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>--}}
                {{--</div>--}}

            </div>

            <div class="intro-btns">

                <div class="btn-facebook">
                    <a href="{{Config::get('business.facebook')}}">
                        <div class="fb-text">Vind ons op Facebook</div>
                        <iframe src="https://www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2FEuropese-Jeugdsportdagen-469371073117233&width=109&layout=button&action=like&size=large&show_faces=false&share=false&height=65&appId=230893793944463"
                                width="109" height="28" style="border:none;overflow:hidden" scrolling="no"
                                frameborder="0" allowTransparency="true"></iframe>
                    </a>
                </div>

                <div class="btn-contact button-linking" data-href="{{url('contact')}}">
                    Contact
                    <div class="seperator-10"></div>
                    <div class="icon">
                        <img id="contact-icon" class="svg" src="/img/icons/arrow_right_icon.svg"/>
                    </div>
                </div>

            </div>

        </div>
    </div>

    <div class="discover-row">
        <div class="content-container">

            @if(isset($page->content->home_options))
                <h2>{{ $page->content->home_options->translation->name }}</h2>
                {{ $page->content->home_options->translation->description }}
            @else
                <h2>Voeg een tekstblok toe met code_name 'home_options'</h2>
                <p>Titel + omschrijving + afbeeldingen voor hieronder</p>
            @endif

            <div class="seperator-50"></div>
            <div class="discover-block">

                {{--Item 1--}}
                <div class="discover-item-wrapper">
                    <div class="discover-item item-1 button-linking"
                         @if(isset($page->content->home_options) && isset($page->content->home_options->images[0])) style="background-image: url(' {{$page->content->home_options->images[0]->medium_image_url}}'); "
                         @endif data-href="@lang('translations.home_option_1.link')">
                    </div>
                    <div class="discover-item-content"><a
                                href="@lang('translations.home_option_1.link')">@lang('translations.home_option_1.name')</a>
                    </div>
                </div>

                {{--Item 2--}}
                <div class="discover-item-wrapper">
                    <div class="discover-item item-2 button-linking"
                         @if(isset($page->content->home_options) && isset($page->content->home_options->images[1])) style="background-image: url(' {{$page->content->home_options->images[1]->medium_image_url}}'); "
                         @endif data-href="@lang('translations.home_option_2.link')">
                    </div>
                    <div class="discover-item-content"><a
                                href="@lang('translations.home_option_2.link')">@lang('translations.home_option_2.name')</a>
                    </div>
                </div>

                {{--Item 3--}}
                <div class="discover-item-wrapper">
                    <div class="discover-item item-3 button-linking"
                         @if(isset($page->content->home_options) && isset($page->content->home_options->images[2])) style="background-image: url(' {{$page->content->home_options->images[2]->medium_image_url}}'); "
                         @endif data-href="@lang('translations.home_option_3.link')">
                    </div>
                    <div class="discover-item-content"><a
                                href="@lang('translations.home_option_3.link')">@lang('translations.home_option_3.name')</a>
                    </div>
                </div>

                {{--Item 4--}}
                <div class="discover-item-wrapper">
                    <div class="discover-item item-4 button-linking"
                         @if(isset($page->content->home_options) && isset($page->content->home_options->images[3])) style="background-image: url(' {{$page->content->home_options->images[3]->medium_image_url}}'); "
                         @endif data-href="@lang('translations.home_option_4.link')">
                    </div>
                    <div class="discover-item-content"><a
                                href="@lang('translations.home_option_4.link')">@lang('translations.home_option_4.name')</a>
                    </div>
                </div>

            </div>

        </div>

    </div>

    @include('layouts.partials.cta')

@section('extra-js')

@endsection

@endsection