@extends('frontend.layouts.index')
@section('content')
{{-- {{dd($galleries)}} --}}
<main id="tg-main" class="tg-main tg-haslayout">
    <div class="container">
        <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                <div id="tg-content" class="tg-content">
                    <div class="tg-titleborder">
                        <h2>Gallery</h2>
                    </div>
                    <div class="tg-gallerymasnory">
                        <ul id="tg-navfilterbale" class="tg-navfilterbale tg-optionset">
                            <li><a class="tg-active" data-filter="*" href="javascript:void(0);">all</a></li>
                            @foreach ($subCat as $item)
                            <li><a data-filter="{{'.'.$item->slug}}" href="javascript:void(0);">{{$item->name}}</a></li>
                            @endforeach


                        </ul>
                        <div id="tg-galleryfilterable" class="tg-galleryfilterable">
                            @foreach ($galleries as $img)
                            <div class="{{'tg-masonrygrid'.' '.$img->subcategory->slug }}">
                                @foreach ($img->file as $gallery)
                                <figure style="margin-bottom: 6px">
                                    <img src="{{ asset('/uploads/photos/'.$gallery->filename) }}"
                                        alt="{{$gallery->filename}}" style="width:auto;height:200px;">
                                    <a class="tg-btnviewimg" href="{{ asset('/uploads/photos/'.$gallery->filename) }}"
                                        data-rel="prettyPhoto[gallery]">+</a>
                                </figure>
                                @endforeach
                                {{-- <figure>
                                    <img src="{{ asset('/uploads/photos/'.$img->filename) }}" alt="{{$img->filename}}">
                                <a class="tg-btnviewimg" href="{{ asset('/uploads/photos/'.$img->filename) }}"
                                    data-rel="prettyPhoto[gallery]">+</a>
                                </figure> --}}
                            </div>
                            @endforeach

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>

@endsection