@extends('user/layouts/main')
@section('title')
    ผลิตภัณฑ์ |
@endsection
@section('container')
    <div id="contact" class="cards-2 bg-gray" style="padding-top: 10rem !important;padding-bottom: 9.5rem !important;">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="text-container">
                        <strong class="text-center">
                            <h2><u>บริษัท ยูพีพี อัลทิเมท แพคกิ้ง จำกัด</u></h2>
                        </strong>
                        <br />
                        <strong class="text-center">
                            <h2><u>ผลิตภัณฑ์</u></h2>
                        </strong>
                        <br />
                        @if (@count($product))
                            @foreach ($product as $products)
                                <div class="card">
                                    <div class="card-icon">
                                        <img src="{{ asset('' . $products['products_img'] . '') }}" class="img-fluid"
                                            style="width: 200px; height: 200px; !important">
                                    </div>
                                    <div class="card-body">
                                        <strong><span
                                                class="card-title text-dark">{{ $products['products_name'] }}</span></strong><br />
                                        <a class="read-more no-line text-info"
                                            href="{{ asset('/products_detail/' . $products['id'] . '') }}"
                                            target="_blank">รายละเอียดเพิ่มเติม <span class="fas fa-long-arrow-alt-right"></span></a>
                                    </div>
                                </div>
                            @endforeach
                        @else
                            <h2 class="text-center text-danger">-ยังไม่มีสินค้าในหมวดที่ท่านเลือก-</h2>
                        @endif
                    </div>
                    <!-- end of text-container -->
                </div>
            </div>
            <!-- end of row -->
        </div>
        <!-- end of form-1 -->
    </div>
@endsection
