@extends('frontend.layouts.app')
@section('content')
    <!-- Breadcrumb -->
    <div class="breadcrumb-bar breadcrumb-bg text-center">
        <div class="container">
            <div class="row">
                <div class="col-md-12 col-12">
                    <h2 class="breadcrumb-title mb-2">Gallery</h2>
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb justify-content-center mb-0">
                            <li class="breadcrumb-item"><a href="{{ route('index') }}"><i class="isax isax-home5"></i></a></li>
                            <li class="breadcrumb-item active" aria-current="page">Gallery</li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>
    </div>
    <!-- /Breadcrumb -->

    <!-- Page Wrapper -->
    <div class="content">
        <div class="container">

            <!-- Gallery Details -->
            <div class="row row-gap-4">
                @foreach ($gallerys as $data)
                    <div class="col-lg-3 col-6">
                        <div class="gallery-card">
                            <div class="gallery-body">
                                <div class="img-wrap">
                                    <img src="{{ asset('backend/assets/images/' . $data->image) }}"
                                        alt="{{config('app.name')}}">
                                    <div class="img-overlay-1">
                                        <a class="gallery-img" data-fancybox="gallery" data-caption="{{config('app.name')}}"
                                            href="{{ asset('backend/assets/images/' . $data->image) }}"
                                            title="{{config('app.name')}}">
                                            <span
                                                class="gallery-eye-icon rounded-circle bg-primary d-flex align-items-center justify-content-center">
                                                <i class="isax isax-eye text-white"></i>
                                            </span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
            <!-- /Gallery Details -->

        </div>
    </div>
    <!-- /Page Wrapper -->
@endsection