@extends('layouts.front-layout')
@section('title') Shop @endsection
@section('content')
    <section class="innerBanner">
        <img src="upload/images/inerbg1.png" class="w-100" alt="img">
        <div class="overlay">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-md-6">
                        <h2>Shop {{$pageData['Product']['top_banner_title'] ? : ''}}</h2>
                    </div>
                    <div class="col-md-6">
                        <img src="upload/images/hero-img.png" class="img-fluid heroGirl" alt="img">
                    </div>
                </div>
            </div>
        </div>
    </section>


    <section class="productMain">
        <div class="container">
            <div class="row">
                @forelse($get_products as $product)

                <div class="col-md-3">
                    <a href="{{route('product.detail',['slug'=>$product->slug]) ? : ''}}" class="product-card">
                        <figure>
                            <img src="{{$product->productImage('product_image') ? : ''}}" class="img-fluid" alt="">
                            <span class="badge">SALE</span>
                        </figure>
                        <div class="card-body">
                            <h5>{{$product->product_name ? : ''}}</h5>
                            <p>&dollar; {{number_format($product->price ? : '')}}</p>
                        </div>
                    </a>
                </div>
                @empty
                    <h3 class="mx-auto text-white">Product Not Found</h3>
                @endforelse

            </div>
        </div>
    </section>
@endsection