
 
        <div class="row justify-content-center">

            @foreach ($shop_products as $product)
                @php($cartItem = Yard::instance('shopping')->getCartItemByProduct($product->id, false, true))
                @php($qtyStr = isset($cartItem->qty) ? "x".$cartItem->qty : 0)
                @php($qty = isset($cartItem->qty) ? $cartItem->qty : 0)
                @php($rowId = isset($cartItem->rowId) ? $cartItem->rowId : '')
              
                <div class="col-6 col-md-6 col-lg-4 text-center mb-4">
                    <div class="text-center product-item">
                        @if ($product->images)
                            @if ($image = $product->images->first())
                                <img src="{{ asset('images/lazy.png') }}" data-original="{{ route('product_image', [$image->slug]) }}" class="lazy mb-2 img-fluid" alt="">

                            @else
                                <img src="{{ asset('images/placeholder.png') }}" class=" mb-2 img-fluid" alt="">
                            @endif
                        @endif

                        <div class="ui-basket-card">
                            <div class="ui-basket-item">
                                <button type="button" class="ui-basket-btn-minus btn-minus-product-shop is-disabled"  
                                    data-product_id="{{ $product->id }}" data-row-id="{{ $cartItem->rowId }}" 
                                    id="cart_btn_minus_{{ $product->id }}" @if($qty <=0) disabled @endif>
                                    <i class="fa fa-minus-circle"></i>
                                </button>
                                <div class="ui-basket-quantity" >
                                    <i class="ion ion-md-basket"></i>
                                    <span class="indicator" id="badge_cart_indicator_{{ $product->id }}">&nbsp;{{ $qtyStr }}</span>

                                </div>
                                <button type="button" class="ui-basket-btn-plus btn-add-product-shop is-disabled" 
                                    data-product_id="{{ $product->id }}" data-row-id="{{ $cartItem->rowId }}" 
                                    id="cart_btn_plus_{{ $product->id }}" @if($qty >=100) disabled @endif>
                                    <i class="fa fa-plus-circle"></i>
                                </button>

                            </div>
                        </div>
                        <h4 class="product-title px-1 mt-2">
                            {{ $product->name }}
                        </h4>
                        <div class="mb-2 product-description px-1">
                            {{ $product->getShortCopy(true, 110) }}
                        </div>
                        <div class="more_details">
                            <a href="" class="btn btn-sm-only-xs btn-default m-2" data-modal="modal-lg" data-toggle="modal"
                                data-target="#modals-load-content" data-id="{{ $product->id }}"
                                data-route="{{ route('web_shop_modal_load') }}"
                                data-action="web-show-product" data-view="with-price">
                                <i class="fa fa-search"></i> Mehr Details</a>
                        </div>
                        <div class="product-item-price mt-2 mt-2 pb-3">
                            {{ $product->getFormattedPrice() }}  &euro;*
                            <br><span class="small text-muted">@if($product->unit) {{ $product->getBasePriceFormattedFull() }} &euro; @else &nbsp; @endif</span>

                        </div>
                    </div>
                </div>
            @endforeach
        </div>

    <script>
        $(document).ready(function() {
            $(function() {
                $("img.lazy").lazyload({
                    effect : "fadeIn"
                });
             });
        });
    </script>