@extends('layout.container')

@section('title', $seo->title)
@section('meta_tags', $seo->meta_tags)
@section('meta_description', $seo->meta_description)

@section('footer_js')
    <script type="text/javascript">
        $(document).ready(function () {
            $('#fixed-collapse-navbar li').removeClass('active');
            $('#fixed-collapse-navbar').find('.products').addClass('active');
        });
    </script>
@endsection

@section('dynamicdata')
    <!--Page header & Title-->
    <section id="page_header">
        <div class="page_title">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <h2 class="title">Products</h2>
                        <div class="page_link">
                            <a href="{!! route('home') !!}">Home</a>
                            <span><i class="fa fa-long-arrow-right"></i>{!! $category->heading !!}</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!--Servic es Gallery-->
    <section id="gallery" class="padding-top padding-top2">
        <div class="container">

            <div class="row">
                <div class="procedure">
                    <div class="col-md-3 col-sm-4">
                        <ul class="tabs">
                            @foreach($categories as $index=>$record)
                                <li @if($record->slug == $category->slug) class="active" @endif ><a href="{!! route('products',$record->slug) !!}">{!! $record->heading !!}</a></li>
                            @endforeach
                        </ul>
                    </div>
                    <div class="col-md-9 col-sm-8">
                        <div class="tab_container">

                            <div id="tab1" class="tab_content">
                                @foreach($products as $product)
                                <div class="col-md-4 col-sm-6 services_wrap heading_space">
                                    <div class="image">
                                        @if(file_exists('uploads/products/'.$product->attachment) && $product->attachment != '')
                                            <img class="img-responsive" src="{!! asset('uploads/products/'.$product->attachment) !!}" alt="{!! $product->heading !!}"/>
                                            <div class="overlay">
                                                <div class="overlay-inner text-center">
                                                    <a href="{!! asset('uploads/products/'.$product->attachment) !!}" class="fancybox icon" data-fancybox-group="gallery"><i class="icon-eye6"></i></a>
                                                </div>
                                            </div>
                                        @else
                                            <img class="img-responsive" src="{!! asset('uploads/noimage.jpg') !!}" alt="{!! $product->heading !!}"/>
                                        @endif
                                    </div>
                                    <div class="gallery_content text-left productlist">
                                        <h3><a href="{!! route('product.show', $product->slug) !!}">{!! $product->heading !!}</a></h3>
                                        <p>{!! $product->short_description !!}</p>
                                        <a class="btn-readmore" href="{!! route('product.show', $product->slug) !!}">- View More</a>

                                    </div>
                                </div>
                                @endforeach
                                <div class="clear"></div>
                                <div class="col-xs-12">
                                    {!! $products->render() !!}
                                </div>
                            </div>

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



            </div>
        </div>
    </section>
@stop