@props([
    'value'  , 'name'
])

 <div class="product-img-slider sticky-side-div">

    <div class="swiper product-thumbnail-slider p-2 rounded bg-light">
        <div class="swiper-wrapper">
            @if (!empty($value))
                @foreach ($value as $data)
                    <div class="swiper-slide">
                        <img src="{{ viewImage($data->$name) }}" alt="" class="img-fluid d-block" />
                    </div>
                @endforeach

            @endif
        </div>
        <div class="swiper-button-next bg-white shadow"></div>
        <div class="swiper-button-prev bg-white shadow"></div>
    </div>



    <div class="swiper product-nav-slider mt-2">
        <div class="swiper-wrapper">
            @if (!empty($value))
                @foreach ($value as $data)
                    <div class="swiper-slide">
                        <div class="nav-slide-item">
                            <img src="{{ viewImage($data->$name) }}" alt="" class="img-fluid d-block" />
                        </div>
                    </div>
                @endforeach
            @endif

        </div>
    </div>

</div>