core/resources/views/visitor/cwbs/homepageLayout.blade.php

<!doctype html>
<html>
<head>
    <title>Custom Wristbands.cz</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
    <link href='https://fonts.googleapis.com/css?family=Ubuntu:400,300,500,700&subset=latin-ext,latin' rel='stylesheet'
          type='text/css'>
    <link href="@asset('foundation.min.css')" type="text/css" rel="stylesheet">
    <script src="@asset('vendor/jquery.min.js')" type="text/javascript"></script>
    <script src="@asset('foundation.min.js')" type="text/javascript"></script>
    <link href="@asset('layout.css')" type="text/css" rel="stylesheet">
    <link href="@asset('style.css')" type="text/css" rel="stylesheet">
</head>
<body>

<div class="top-bar homepage">
    <div class="top-bar-left">
        <ul class="menu">
            <li class="menu-text">
                <a href="{{route('page.index')}}">
                    <img id="logo" src="@asset('images/cwbs_logo_medium.png')" alt="Custom Wristbands Logo">
                </a>
            </li>
        </ul>
    </div>
    <div class="top-bar-right">
        <ul class="menu pull-right hide-for-large">
            <li>
                <a href="#" onclick="showResponsiveMenu()" id="show-menu">MENU<i class="fa fa-fw fa-2x fa-navicon"></i></a>
            </li>
        </ul>
        <div id="responsive-menu">
            <a href="#" id="unload-menu" class="hide-for-large" onclick="hideResponsiveMenu();"><i class="fa fa-fw fa-2x fa-mail-reply"></i></a>
            @widgetArea('mainMenu')
        </div>
    </div>
</div>
@widgetArea('homepageSlider')

<div id="content">
    @yield('content')

    <div class="green-wrapper clearfix">
        <div class="row column text-center" id="questions">
            <h4 class="w-t">MÁTE DOTAZY? NEBO NÁM CHCETE ZASLAT RYCHLOU POPTÁVKU?</h4>
            <a href="{{route('page.content', ['url' => 'kontakt'])}}" class="button secondary m-t-25  large rounded">RYCHLÝ FORMULÁŘ</a>
        </div>
    </div>
    <div class="white-wrapper clearfix">
        <div class="row column medium-11 small-10 small-centered medium-centered " id="design">
            <div class="columns medium-7 ">
                @widgetArea('infoSirsi')
                {{--<h6>Design a potisk</h6>--}}
                {{--<p>--}}
                    {{--<strong><i>--}}
                            {{--Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor--}}
                            {{--incididunt ut labore et dolore magna aliqua, amet, consectetur adipiscing elit,--}}
                            {{--sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.--}}
                        {{--</i></strong>--}}
                {{--</p>--}}
                {{--<p>--}}
                    {{--Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore--}}
                    {{--et--}}
                    {{--dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut--}}
                    {{--aliquip--}}
                    {{--ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum--}}
                    {{--dolore--}}
                    {{--eu fugiat nulla pariatur.--}}
                {{--</p>--}}
            </div>
            <div class="columns medium-5">

                @widgetArea('infoUzsi')

                {{--<ul class="design-ul-block">--}}
                    {{--<li>--}}

                        {{--<h6 class="lowercase">--}}
                            {{--Proč si vybrat právě nás?--}}
                        {{--</h6>--}}
                        {{--<p class="small">--}}
                            {{--Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor--}}
                            {{--incididunt ut labore et dolore magna aliqua, amet, consectetur adipiscing elit,--}}
                            {{--sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.--}}
                        {{--</p>--}}
                    {{--</li>--}}
                    {{--<li>--}}
                        {{--<h6 class="lowercase">--}}
                            {{--Jaký používáme materiál?--}}
                        {{--</h6>--}}
                        {{--<p class="small">--}}
                            {{--Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor--}}
                            {{--incididunt ut labore et dolore magna aliqua, amet, consectetur adipiscing elit,--}}
                            {{--sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.--}}
                        {{--</p>--}}
                    {{--</li>--}}
                {{--</ul>--}}
            </div>
        </div>
    </div>
    <div class="large">
        <div class="row column text-center">
            <h2 id="galerie">Galerie</h2>
            <hr>
        </div>
        @widgetArea('galerieSlider')
    </div>
</div>
<footer class="large">
    <div class="row text-center">
        <ul class="menu social-icons">
            <li>
                <a href="#" target="_blank">
                    <span class="fa-stack fa-lg">
                        <i class="fa fa-circle fa-stack-2x"></i>
                        <i class="fa fa-facebook fa-stack-1x w-t"></i>
                    </span>
                </a>
            </li>
            <li>
                <a href="#" target="_blank">
                    <span class="fa-stack fa-lg">
                        <i class="fa fa-circle fa-stack-2x"></i>
                        <i class="fa fa fa-google-plus fa-stack-1x w-t"></i>
                    </span>
                </a>
            </li>
            <li>
                <a href="#" target="_blank">
                    <span class="fa-stack fa-lg">
                        <i class="fa fa-circle fa-stack-2x"></i>
                        <i class="fa fa-instagram fa-stack-1x w-t"></i>
                    </span>
                </a>
            </li>
            <li>
                <a href="#" target="_blank">
                    <span class="fa-stack fa-lg">
                        <i class="fa fa-circle fa-stack-2x"></i>
                        <i class="fa fa-pinterest-p fa-stack-1x w-t"></i>
                    </span>
                </a>
            </li>
        </ul>
        <div class="clearfix"></div>
        @widgetArea('mainMenu')
        <div class="clearfix"></div>
        <hr>
        <p>
            @widgetArea('footer')
        </p>
    </div>

</footer>
<script type="text/javascript">
    $ (function () {
        $ (document).foundation ();
    });

    var menuHolder = document.getElementById('responsive-menu');

    function showResponsiveMenu() {
        menuHolder.style.display="block";
        menuHolder.style.height = document.documentElement.clientHeight + 'px';
        menuHolder.style.height = window.innerHeight + 'px';
        menuHolder.style.height = '100%;';
    }

    function hideResponsiveMenu() {
        menuHolder.style.display="none";
    }

    window.onresize = function() {
        if(window.innerWidth >= 1023) {
            menuHolder.style.display="block";
            menuHolder.style.height = "auto";
        } else {
            hideResponsiveMenu();
        }
    };

</script>
</body>
</html>