@extends('layouts.master')


@section('title', Lang::get('events.meta_title'))

@section('description', Lang::get('events.meta_description'))


@section('content')

    @parent


    <nav class="mobile-nav">

        <img class="logo" src="{{ asset('/assets/images/logo-colored.svg') }}" title="{{ Lang::get('home.logo-title') }}">

        <span class="close">
            <img class="icon" src="{{ asset('/assets/images/close.svg') }}">
        </span>

        <a class="link" href="/#about">{{ Lang::get('home.menu.element1') }}</a>
        <a class="link" href="/#how-it-works">{{ Lang::get('home.menu.element2') }}</a>
        <a class="link" href="/events">{{ Lang::get('home.menu.element5') }}</a>
        <a class="link" href="https://blog.hopla.co">{{ Lang::get('home.menu.element3') }}</a>
        <a class="button big" href="https://teacher.hopla.co/{{ Lang::locale() }}" target="_blank">{{ Lang::get('home.menu.element4') }}</a>

        <div class="socials">
            <a href="https://www.facebook.com/hoplaApp" target="_blank">
                <img class="icon" src="{{ asset('/assets/images/facebook.svg') }}">
            </a>
            <a href="https://twitter.com/HoplaApp" target="_blank">
                <img class="icon" src="{{ asset('/assets/images/twitter.svg') }}">
            </a>
            <a href="https://instagram.com/HoplaApp" target="_blank">
                <img class="icon" src="{{ asset('/assets/images/instagram.svg') }}">
            </a>
        </div>

    </nav>


    <header class="header event">

        <div class="block-top">
            
            <a href="{{ route('home') }}">
                <img class="logo" src="{{ asset('/assets/images/logo.svg') }}" title="{{ Lang::get('home.logo-title') }}">
            </a>

            <nav class="navigation">
                <a class="link light" href="/#about">{{ Lang::get('home.menu.element1') }}</a>
                <a class="link light" href="/#how-it-works">{{ Lang::get('home.menu.element2') }}</a>
                <a class="link light" href="/events">{{ Lang::get('home.menu.element5') }}</a>
                <a class="link light" href="https://blog.hopla.co">{{ Lang::get('home.menu.element3') }}</a>
                <a class="button light" href="https://teacher.hopla.co/{{ Lang::locale() }}" target="_blank">{{ Lang::get('home.menu.element4') }}</a>
            </nav>

            <span class="mobile-nav-toggle link" href="#"><img class="icon" src="{{ asset('/assets/images/menu.svg') }}"></span>

        </div>

        <div class="tagline">
            <h1 class="title title-1 light">{!! Lang::get('events.header.tagline') !!}</h1>
            <a class="button-plain big" href="#events">{{ Lang::get('events.header.cta') }}</a>   
        </div>

    </header>



    <section id="events" class="intro">
        
        <div class="wrapper no-table">

            <h2 class="title title-3"><strong>{!! Lang::get('events.event_list.title_mtl') !!}</strong></h2>

            <p class="reading-text">{!! Lang::get('events.event_list.text_mtl') !!}</p>

            <div class="events">

                <!--
                <article class="event">
                    <div class="date">
                        <span class="number">04</span>
                        <span class="month">{{ Lang::get('events.events.event4.month') }}</span>
                    </div>
                    <div class="content">
                        <div class="location">{{ Lang::get('events.events.event4.location') }}</div>

                        <div class="infos">04 {{ Lang::get('events.events.event4.month') }} {{ Lang::get('events.to') }} {{ Lang::get('events.events.event4.hour') }}</div>

                        <a class="button-plain dark" href="https://www.facebook.com/events/1143284222399111/" target="_blank">{{ Lang::get('events.event_details') }}</a>
                    </div>
                </article>
                -->

                <div class="info-box mid-light">{{ Lang::get('events.events.no_event') }}</div>

            </div>


        </div>

    </section>



    <section class="blog">
        
        <div class="wrapper">

            <div class="block-text">
                <p class="text title-4">{!! Lang::get('home.blog.text') !!}</p>
            </div>

            <div class="block-button">
                <a class="button dark big" href="//blog.hopla.co">{!! Lang::get('home.blog.cta') !!}</a>
            </div>

        </div>

    </section>


    <footer class="footer">
        
        <p class="block-left reading-text">{{ Lang::get('home.footer.copyrights') }}</p>

        <p class="block-center reading-text">{!! Lang::get('home.footer.madein', ['image' => asset('/assets/images/heart.svg')]) !!}</p>

        <nav class="block-right">

            <a class="link" href="mailto:support@hopla.co" target="_blank">{{ Lang::get('home.footer.contact') }}</a>

            <a class="link" href="{{ asset('files/hopla-media-kit.zip') }}" target="_blank">{{ Lang::get('home.footer.mediakit') }}</a>

            @if( App::getLocale() == 'en' )
                <a class="button small dark" href="{{ route('switchLocale', ['language' => 'fr']) }}" title="{{ Lang::get('home.language-toggle-title') }}">{{ Lang::get('home.language-toggle') }}</a>
            @else
                <a class="button small dark" href="{{ route('switchLocale', ['language' => 'en']) }}" title="{{ Lang::get('home.language-toggle-title') }}">{{ Lang::get('home.language-toggle') }}</a>
            @endif

        </nav>

    </footer>


    <div id="video-modal" class="modal">
        <div class="container">
            <div id="close-video" class="popup">
                <div class="popup-content">
                    <div class='embed-container'>
                        <iframe src='https://player.vimeo.com/video/177469371?title=0&byline=0&portrait=0' frameborder='0' webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
                    </div>
                </div>
            </div>
        </div>                   
    </div>

@stop


@section('js')
    
    <script src="{{ asset('assets/js/app.js') }}?t=287287"></script>

@stop