@extends('Layouts.index')
@section('content')
    <!-- artikel -->
    <section class="bg-light">
        <div class="row">
            <div class="col-md-12 bg-pattern3 py-11">
                <div class="d-flex align-items-center justify-content-center">
                    <h2 class="fs-45 fw-semibold pt-5 p-0 mb-0 text-dark">Galeri <span class="text-primary">Jagoti</span></h2>
                </div>
                <p class="fs-16 text-center">Galeri Foto & Video JAGOTI LMS</p>
            </div>
        </div>
        <!--/.row -->
        <div class="container pt-10">
            <div class="grid grid-view projects-masonry">
                {{-- <div class="isotope-filter filter mb-10">
              <ul>
                <li><a class="filter-item active" data-filter="*">All</a></li>
                <li><a class="filter-item" data-filter=".foods">Foods</a></li>
                <li><a class="filter-item" data-filter=".drinks">Drinks</a></li>
                <li><a class="filter-item" data-filter=".events">Events</a></li>
                <li><a class="filter-item" data-filter=".pastries">Pastries</a></li>
              </ul>
            </div> --}}
                <div id="categoryItems" class="row gx-md-6 gy-6 isotope mb-5">

                @foreach( $groupbyCategory as $category => $items)
                    <div class="project item col-md-4 px-5">
                        <div class="card">
                            <figure class="img-top overlay overlay-1 rounded-top img-gallery">
                                <a class="gallery-item" href="{{url('Media/album').'/'.$items[0]['CategoryId']}}">
                                    <img src="{{ $intcms->url }}upload/gallery/{{ $items[0]['Media'] }}" alt="" class="gallery-item" />
                                </a>
                                <figcaption>
                                    <h5 class="from-top mb-0">Lihat Album</h5>
                                </figcaption>
                            </figure>
                            <div class="card-footer py-4 bg-white rounded-bottom border-top">
                                <a class="nav-link" href="{{url('Media/album').'/'.$items[0]['CategoryId']}}">
                                    <h6 class="text-ash text-center fw-semibold mb-0">{{ $category }}</h6>
                                </a>
                            </div>
                        </div>
                        
                    </div>
                @endforeach

                    <!-- /.project -->
                </div>
                <!-- /.row -->
            </div>
            <!-- /.grid -->
        </div>
    </section>
@endsection