@extends('layouts.master')
@section('content')


<div class="container pt-4">
    {{-- Renderiza a trilha dinâmica, passando a galeria atual para ela --}}
    {{ Breadcrumbs::render('fotos-galeria', $gallery) }}
</div>


    <section class="my-5">
        <h2 class="mb-4">Todas Fotos</h2>
        <div class="container">
            <div class="row">
                @foreach ($gallery->photos as $photo)
                    <div class="col m-2 text-center">
                        <a href="{{ asset('/assets/gallery/images/' . $photo->image) }}" data-fancybox="gallery"
                            data-caption="{{ $photo->caption ?? '' }}">
                            <img src="{{ asset('/assets/gallery/images/' . $photo->image) }}" width="200"
                                alt="{{ $photo->caption ?? '' }}">
                        </a>
                    </div>
                @endforeach
            </div>
        </div>
    </section>
@endsection
<script>
    Fancybox.bind('[data-fancybox="gallery"]', {
        infinite: true,
        keyboard: true,
        dragToClose: true,
        Toolbar: {
            display: [
                "close",
                "zoom",
                "slideshow",
                "fullscreen",
                "download",
                "thumbs",
                "share",
            ],
        },
    });
</script>