@extends('layouts/lakeresort')

@php
    if ( app()->getLocale() == "hu" ) {
        SEOMeta::setTitle('Galéria: külső képek');
    }

    if ( app()->getLocale() == "en" ) {
    SEOMeta::setTitle('Gallery: Building photos');
    }

    if ( app()->getLocale() == "de" ) {
    SEOMeta::setTitle('Bildergalerie: Gebäudefotos');
    }

    if (app()->getLocale() == 'ru') {
        SEOMeta::setTitle('Галерея: Фотографии зданий');
    }

    $images = config('gallery.kulso_kepek');

@endphp


@section('content')


<header class="uk-section uk-section-default">
    <div class="uk-container" uk-scrollspy="cls:uk-animation-slide-bottom-medium">
      <div class="uk-text-center uk-text-xsmall uk-text-medium uk-text-uppercase uk-text-secondary lp3 uk-margin">{{ __('Galéria') }}</div>
      <h2 class="uk-text-center uk-margin-remove">{{ __('Külső képek') }}</h2>
    </div>
    <!-- // container -->
  </header>

<main>

  <section class="uk-section uk-section-muted">

    <div class="uk-container" uk-scrollspy="cls:uk-animation-slide-bottom-medium">
      <div class="uk-child-width-1-2 uk-child-width-1-3@m uk-grid-small" uk-grid="masonry: true; parallax: 50" uk-lightbox>


        @foreach ( $images as $image )
        <div>
          <a href="{{ $image['image'] }}" class="uk-inline-clip uk-transition-toggle uk-link-toggle" tabindex="0">
            <img class="uk-transition-scale-up uk-transition-opaque" src="{{ $image['thumb'] }}" alt="" />
            <div class="uk-transition-fade uk-position-cover uk-overlay-primary uk-flex uk-flex-center uk-flex-middle">
              <span class="uk-transition-slide-top">
                <span uk-icon="icon: image; ratio: 2"></span>
              </span>
            </div>
          </a>
        </div><!-- // child -->
        @endforeach

      </div><!-- // grid -->

    </div><!-- // container -->
  </section>
</main>


@endsection