<?php $__env->startSection('editable_content'); ?>

    <a class="return-to-overview" href="/<?php echo $links->service->route; ?>">
        <span class="arrow"><?php echo $__env->make('svg.arrow', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?></span>
        <p><?php echo \Illuminate\Support\Facades\Lang::get('translations.returnToOverview'); ?></p>
    </a>

    <div class="color-wrapper">
        <?php echo $__env->make('layouts.partials.navigation', ['shadow' => true], array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>

        <div class="project-detail-content">

            <div class="background">
                <span class="left"></span>
                <span class="right"></span>
            </div>


            <div class="grid-row">

                <?php echo $__env->make('layouts.partials.projects.subMenu', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>

                <div class="content">
                    <h1 class="mobile"><?php echo $page->project->translation->name; ?></h1>
                    <?php if(count($page->project->translation->projectDescription) > 0): ?>
                        <div class="grid-row">
                            <div class="grid-col text">
                                <h1 class="desktop"><?php echo $page->project->translation->name; ?></h1>
                                <?php echo $page->project->translation->projectDescription[0]->description; ?>

                            </div>

                            <div class="grid-col images">
                                <?php if(!empty($page->project->translation->projectDescription[0]->images) && count($page->project->translation->projectDescription[0]->images) > 0): ?>
                                    <?php foreach(['medium', 'small'] as $imageSize): ?>
                                        <span style="background-image: url('<?php echo $page->project->translation->projectDescription[0]->images[0]->{$imageSize.'_image_url'}; ?>');"></span>
                                    <?php endforeach; ?>


                                <picture>
                                    <source media="(max-width: 425px)"
                                            srcset="<?php echo $page->project->translation->projectDescription[0]->images[0]->small_image_url; ?>">
                                    <img src="<?php echo $page->project->translation->projectDescription[0]->images[0]->medium_image_url; ?>"
                                         alt="image">
                                </picture>
                                <?php endif; ?>
                            </div>
                        </div>
                    <?php endif; ?>
                    <?php if(count($page->project->translation->projectDescription) > 1): ?>
                        <div class="grid-row">
                            <div class="grid-col images">
                                <?php if(!empty($page->project->translation->projectDescription[1]->images) && count($page->project->translation->projectDescription[1]->images) > 0): ?>
                                    <?php foreach(['medium', 'small'] as $imageSize): ?>
                                        <span style="background-image: url('<?php echo $page->project->translation->projectDescription[1]->images[0]->{$imageSize.'_image_url'}; ?>');"></span>
                                    <?php endforeach; ?>


                                <picture>
                                    <source media="(max-width: 425px)"
                                            srcset="<?php echo $page->project->translation->projectDescription[1]->images[0]->small_image_url; ?>">
                                    <img src="<?php echo $page->project->translation->projectDescription[1]->images[0]->medium_image_url; ?>"
                                         alt="image">
                                </picture>
                                <?php endif; ?>
                            </div>
                            <div class="grid-col text">
                                <?php echo $page->project->translation->projectDescription[1]->description; ?>

                            </div>
                        </div>
                    <?php endif; ?>
                </div>

            </div>

        </div>

    </div>

<?php $__env->stopSection(); ?>

<?php $__env->startSection('extra-js'); ?>
    <script src="/js/form.js"></script>
    <script>
        //Define form
        var smallOfferForm = new Form('smallOfferForm', ['name', 'phone']);

        // Submit button
        document.querySelector('#smallOfferForm .submit').addEventListener('click', function () {

            smallOfferForm.validate();
            if (smallOfferForm.valid) smallOfferForm.send();

        });
    </script>

    <script type="text/javascript" src="/js/googleMaps.js"></script>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC-FTocuOW1v6VPNAG8z2h6yT94pof8K3A"
            type="text/javascript"></script>

<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.master', ['view' => 'project-detail'], array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>