@extends('layouts.app')

@section('content')
<div id="main" class="container-fluid">
    <div class="row row-cols-sm-2">
        <div class="col col-sm-10">
            <div class="row">
            @foreach($products['data'] as $row)
                <div class="col-3 col-sm-3 col-md-3 col-lg-2 col-xxl-2">
                    <figure class="figure">
                        <a href="{{ $row['productUrl'] }}" target="_blank">
                            <img src="{{ $row['productImage'] }}" class="figure-img img-fluid rounded" alt="{{ $row['productName'] }}"/>
                        </a>
                        <figcaption class="figure-caption">
                            <a href="{{ $row['productUrl'] }}" target="_blank">{{ $row['productName'] }}</a>
                        </figcaption>
                        <p>{{ number_format($row['productPrice']) }} <small>원</small></p>
                        <div class="row g-2">
                            @if($row['isRocket'])
                                <div class="col-auto">
                                <span class="badge text-bg-info text-light">
                                    <i class="bi bi-rocket-takeoff"></i> 로켓배송
                                </span>
                                </div>
                            @endif
                            @if($row['isFreeShipping'])
                                <div class="col-auto">
                                <span class="badge text-bg-warning">
                                    <i class="bi bi-truck"></i> 무료배송
                                </span>
                                </div>
                            @endif
                        </div>
                    </figure>
                </div>
            @endforeach
            </div>
        </div>
        <div class="col col-sm-2 text-center ads">
            <a href="https://link.coupang.com/a/4c7fK" target="_blank" referrerpolicy="unsafe-url"><img src="https://ads-partners.coupang.com/banners/630876?subId=&traceId=V0-301-879dd1202e5c73b2-I630876&w=320&h=100" alt=""></a>
            <a href="https://link.coupang.com/a/4c7I4" target="_blank" referrerpolicy="unsafe-url"><img src="https://ads-partners.coupang.com/banners/630879?subId=&traceId=V0-301-969b06e95b87326d-I630879&w=320&h=100" alt=""></a>
            <a href="https://link.coupang.com/a/4c75Q" target="_blank" referrerpolicy="unsafe-url"><img src="https://ads-partners.coupang.com/banners/683762?subId=&traceId=V0-301-50c6c2b97fba9aee-I683762&w=320&h=100" alt=""></a>
            <a href="https://link.coupang.com/a/4dc2E" target="_blank" referrerpolicy="unsafe-url"><img src="https://ads-partners.coupang.com/banners/684142?subId=&traceId=V0-301-5f9bd61900e673c0-I684142&w=320&h=480" alt=""></a>
            <a href="https://link.coupang.com/a/4c8dQ" target="_blank" referrerpolicy="unsafe-url"><img src="https://ads-partners.coupang.com/banners/684129?subId=&traceId=V0-301-5a8c79a76485eb21-I684129&w=320&h=100" alt=""></a>
            <a href="https://link.coupang.com/a/4c8kK" target="_blank" referrerpolicy="unsafe-url"><img src="https://ads-partners.coupang.com/banners/684131?subId=&traceId=V0-301-5f9bd61900e673c0-I684131&w=320&h=100" alt=""></a>
            <a href="https://link.coupang.com/a/4ddc7" target="_blank" referrerpolicy="unsafe-url"><img src="https://ads-partners.coupang.com/banners/684143?subId=&traceId=V0-301-bae0f72e5e59e45f-I684143&w=320&h=480" alt=""></a>
            <a href="https://link.coupang.com/a/4c8q5" target="_blank" referrerpolicy="unsafe-url"><img src="https://ads-partners.coupang.com/banners/684134?subId=&traceId=V0-301-f5c692db558def48-I684134&w=320&h=100" alt=""></a>
            <a href="https://link.coupang.com/a/4c8uf" target="_blank" referrerpolicy="unsafe-url"><img src="https://ads-partners.coupang.com/banners/684136?subId=&traceId=V0-301-2f679fc6bd8f2e58-I684136&w=320&h=100" alt=""></a>
            <a href="https://link.coupang.com/a/4c8yj" target="_blank" referrerpolicy="unsafe-url"><img src="https://ads-partners.coupang.com/banners/684139?subId=&traceId=V0-301-2b8ef06377ec8f50-I684139&w=320&h=100" alt=""></a>
        </div>
    </div>
</div>
@endsection