{{-- banner --}}
<div class="card-container" style="box-shadow:none; text-align:center;">
    <div class="card-body">
        <div id="carousel-interval">
            <div class="card-content" style="margin: 0 -8px -8px;">
                <div id="carousel-example-interval" class="carousel slide" data-ride="carousel">
                    <div role="listbox">

                        {{-- banner content --}}
                        @php $i = 0; @endphp
                        @if ($banner_widgets)

                            @foreach($banner_widgets as $row)

                            @php
                            if($i == 0)
                            {
                                $row_active = 'active';
                            } else {
                                $row_active = '';
                            }
                            @endphp

                            <div class="carousel-item {{ $row_active }}" data-interval="10000">
                                <img class="img-fluid"
                                src="{{ url( $row['images_url']) }}"
                                alt="{{ $row['title'] }}"
                                style="border-radius: 5px;">
                            </div>
                            @php $i++; @endphp
                            @endforeach

                        @endif
                        {{-- end banner content --}}

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{{-- end banner --}}