@extends('frontend.layouts.app')

@section('content')



<!-- /NAVIGATION -->
<div class="breadcrumb-all">
    <div class="container">
        <ul class="breadcrumb">
            <li><a href="{{ route('frontend.home' , ['lang'=> App::getLocale()]) }}">{{ __('frontend.home') }}</a></li>
            <li class="active">{{ $category->name }}</li>
        </ul>
    </div>
</div>




<section class="main-container project-area min-height">
    <div class="container">
        <div class="row">

            <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12">

                <div class="sidebar sidebar-left">

                    <div class="widget">
                        <h3 class="widget-title">{{ __('frontend.categories') }}</h3>
                        <ul class="arrow nav nav-tabs nav-stacked">
                            @foreach ($mainCategories as $item)
                            <li><a href="{{ route('frontend.mainCategories.show' , ['category_id'=> $item->id , 'lang'=> App::getLocale()]) }}">{{ $item->name}} </a></li>
                            {{-- <li><a href="#">{{ $item->name}} </a></li> --}}
                            @endforeach
                        </ul>
                    </div><!-- Categories end -->

                </div><!-- Sidebar end -->
            </div><!-- Sidebar Col end -->

            <div class="col-lg-9 col-md-9 col-sm-12 col-xs-12">
                <div class="row">
                    <div class="isotope">

                        @foreach ($category->categories as $item)
                        <div class="col-md-6 col-xs-12 isotope-item">
                            <div class="isotope-img-container">
                                <a href="{{ route('frontend.products.categories.show' , ['category'=> $item ,'lang'=> App::getLocale() ]) }}">
                                    <img class="img-responsive" src="{{ $item->image }}" alt="{{ $item->name }}">
                                    <div class="project-item-info">
                                        <div class="project-item-info-content">
                                            <h3 class="title-top">{{ $item->name }}</h3>
                                            <h3 class="project-item-title">
                                                <span class="gallery-icon"><i
                                                        class="fa fa-arrow-circle-right"></i></span>
                                            </h3>
                                            <!-- <p class="project-cat">Air Filteration</p> -->
                                        </div>
                                    </div>
                                </a>
                            </div>
                        </div><!-- Isotope item 3 end -->
                        @endforeach

                    </div>
                </div><!-- Content row end -->
            </div>
        </div><!-- Content Col end -->

    </div><!-- Main row end -->

    </div><!-- Container end -->
</section><!-- Main container end -->


@endsection