@extends('layouts.front')

@section('content')
    <div class="container category-page page-content main-content">
        <div class="row">
            <div class="col-lg-9" id="product-list-container" style="position: relative">
                <div class="product-filters-section">
                    <div class="d-flex justify-content-between filter-top-box">
{{--                    <attribute-filters :prop-attributes="{{json_encode([])}}"></attribute-filters>--}}
{{--                        @include('front.partials.category-list-mobile')--}}
                    </div>
                </div>
                <div class="product-grid">
                    @foreach($products as $index => $product)
                        <product-item :product="{{json_encode($product)}}"></product-item>
                    @endforeach
                </div>

                <nav class="toolbox toolbox-pagination justify-content-center">
                    <pagination :total="{{$total}}"></pagination>
                </nav>
            </div>

        </div><!-- End .row -->
    </div><!-- End .container -->
@endsection