@extends('layouts.frontend')

@section('title')
Gallery
@endsection
@section('content')
<!-- Product Subcategory Section Start -->
    <section id="page-section" class="my-md-5">
        <div class="container py-3">
            <div class="row mb-5">
                <div class="col-12">
                    <div class="title">
                        <h2>Gallery</h2>
                    </div>
                </div>
            </div>
            <div class="br"></div>
            <div class="row my-5">
                <!--<div class="uk-position-relative uk-visible-toggle" tabindex="-1" uk-slider="autoplay: true; autoplay-interval: 3000">-->
                <!--<ul class="uk-slider-items uk-child-width-1-1 uk-child-width-1-3@s uk-child-width-1-4@m">-->
                @foreach($all_photo as $photo)
                <div class="col-md-3 my-2">
                    <div class="card">
                        <div class="card-body pb-0">
                            <div class="card-img">
                                
                                  <div uk-lightbox>  
                                  <a href="{{asset('uploads/gallery')}}/{{$photo->image}}" target="_blank">
                                    <img src="{{asset('uploads/gallery')}}/{{$photo->image}}" class="img-fluid" alt=""></a>
                                    </div>
                            </div>
                            <div class="card-title d-block">
                                <p class="text-center mt-3" style="color:{{$color->color_code}}">{{$photo->title}}</p>
                            </div>
                        </div>
                    </div>
                </div>
                @endforeach
            <!--    <a class="uk-position-center-left uk-position-small uk-hidden-hover" href="#" uk-slidenav-previous uk-slider-item="previous"></a>-->
            <!--    <a class="uk-position-center-right uk-position-small uk-hidden-hover" href="#" uk-slidenav-next uk-slider-item="next"></a>-->
            <!--</ul>-->
            <!--</div>-->
     
            </div>
        </div>
    </section>
<!-- Product Subcategory Section End -->

@endsection