@extends('layouts.frontend.main')
@section('title','Galerie')
@section('styles')
    @include('pages.frontend.components.gallery_styles_links')
@endsection
@section('body')

    <!-- Page Header Start -->
    <div class="page-header">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <h2>Notre Galerie</h2>
                </div>
                <div class="col-12">
                    <a href="{{ url('/') }}">Accueil</a>
                    <a href="{{url('/galery')}}">Gelerie</a>
                </div>
            </div>
        </div>
    </div>
    <!-- Page Header End -->


    <!-- Portfolio Start -->
    <div class="portfolio">
        <div class="container">
            <div class="section-header text-center">
                <p>Galerie</p>
                <h2>Visitez Notre Galerie</h2>
            </div>
            <div class="row">
                <div class="col-12">
                    <ul id="portfolio-flters">
                        <li data-filter="*" class="filter-active">All</li>
                        @foreach($galerie as $galerietype)
                            <li data-filter="{{$galerietype->id}}">{{$galerietype->title}}</li>
                        @endforeach
                    </ul>
                </div>
            </div>
            <div class="row portfolio-container">
                @foreach($galerie as $galeries)
                    <div class="col-lg-4 col-md-6 col-sm-12 portfolio-item {{$galeries->id}} wow fadeInUp" data-wow-delay="0.1s">
                        <div class="portfolio-warp">
                            <div class="portfolio-img">
                                <img src="{{asset('storage/backend/images/galleries/' .$galeries->file)}}" alt="Image">
                                <div class="portfolio-overlay">
                                    <p>
                                        {!! Str::words($galeries->description, 20) !!}
                                    </p>
                                </div>
                            </div>
                            <div class="portfolio-text">
                                <h3>{{$galeries->title}}</h3>
                                <a class="btn" href="{{asset('storage/backend/images/galleries/' .$galeries->file)}}" data-lightbox="portfolio">+</a>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>


            <div class="row">
                <div class="col-12 load-more">
                    <a class="btn" href="#">Load More</a>
                </div>
            </div>
        </div>
    </div>
    <!-- Portfolio End -->


@endsection
@section('scripts')
    @include('pages.frontend.components.gallery_scripts_links')
@endsection