@extends('front.layout.main')
@section('title_and_meta')
    <title>{{ $category->meta_title }} | Wishours</title>
    <meta name="description" content="{{ $category->meta_description }}" />
    <meta name="keywords" content="{{ $category->meta_keywords }}" />
@endsection
@section('content')
            <div class="banner banner-cat" style="background-image: url('{{ asset('/uploads')  }}/{{ $category->catthumb }}');">
                <div class="banner-content container">
                    <h2 class="banner-subtitle">check out over <span>200+</span></h2>
                    <h1 class="banner-title">
                    {{ $category->title }}
                    </h1>
                </div><!-- End .banner-content -->
            </div><!-- End .banner -->

            <nav aria-label="breadcrumb" class="breadcrumb-nav">
                <div class="container">
                    <ol class="breadcrumb mt-0">
                        <li class="breadcrumb-item"><a href="{{ route('homepage') }}"><i class="icon-home"></i></a></li>
                        <li class="breadcrumb-item active"><a href="category.html">{{ $category->title }}</a></li>
                    </ol>
                </div><!-- End .container -->
            </nav>

            <div class="container">
                <div class="product-wrapper">
                    <div class="row row-sm category-grid">

                      @foreach($subcat as $subcatgory)
                        <div class="col-6 col-md-4 col-lg-3">
                            <div class="grid-product">
                                <figure class="product-image-container">
                                    <a href="{{ route('product.listing',$subcatgory->slug) }}" class="product-image">
                                        <img src="{{ asset('/uploads')  }}/{{ $subcatgory->catthumb }}" alt="product">
                                    </a>
                                    <a href="ajax/product-quick-view.html" class="btn-quickview">Quickview</a>
                                    <span class="product-label label-hot">Hot</span>
                                </figure>
                                <div class="product-details">
                                    <h2 class="product-title">
                                        <a href="{{ route('product.listing',$subcatgory->slug) }}">{{$subcatgory->title}}</a>
                                    </h2>
                                </div><!-- End .product-details -->
                            </div><!-- End .product -->
                        </div><!-- End .col-md-4 -->
                        @endforeach
                    </div><!-- End .row -->
                </div>
            </div><!-- End .container -->

            <div class="mb-5"></div><!-- margin -->
@endsection