@extends('app')

@section('content')

    {{-- Banner Rotativo --}}
    <div class="row">
        <div id="carouselExampleInterval" class="carousel slide carousel-fade row-banner" data-ride="carousel">
            <ol class="carousel-indicators">
                @for($i = 0; $i < sizeof($banners); $i++)
                    <li data-target="#carouselExampleInterval" data-slide-to="" class=" active"></li>
                @endfor
            </ol>
            <div class="carousel-inner">
                @for($i = 0; $i < sizeof($banners); $i++)
                    <div class="carousel-item  active">
                        @if(!empty($banners[$i]->url))
                            <a href="{{$banners[$i]->url}}" target="_blank"><img src="/uploads/banners/{{$banners[$i]->foto}}" class="d-block w-100" alt="{{$banners[$i]->nome}}"></a>
                        @else
                            <img src="/uploads/banners/{{$banners[$i]->foto}}" class="d-block w-100" alt="{{$banners[$i]->nome}}">
                        @endif
                    </div>
                @endfor
            </div>

        </div>
    </div>
    {{-- Blocos --}}
    <div class="row mt-5">
        <div class="col-12 col-md-10 offset-md-1 text-center">
            <h5 class="text-center mb-0 linha mb-3 pb-2">{{ $home->titulo_home }}</h5>
            <span class="clearfix"></span>

            @if(sizeof($blocos) > 0)
                        @foreach($blocos as $bloco)
                            {!! !empty($bloco->link) ? '<a href="'.$bloco->link.'"><img src="/uploads/blocos/'.$bloco->icone.'"></a>' : '<img class="img-fluid" alt="{{$bloco->titulo}}" src="/uploads/blocos/'.$bloco->icone.'">'  !!}
                        @endforeach
                @endif
        </div>
    </div>
    {{-- Destaques --}}
    <div class="row mt-5">
        <div class="col-12 col-md-10 offset-md-1 text-center">
            <h4 class="text-center mb-0 linha mb-4 pb-2">Destaques</h4>
            <div class="row no-gutters">
                @foreach($destaques as $destaque)
                    <div class="col-12 col-md-4 mt-2 mt-md-4 px-2">
                        {!! !empty($destaque->link) ? '<a href="'.$destaque->link.'"><img class="img-fluid" src="/uploads/destaques/'.$destaque->foto.'"></a>' : '<img class="img-fluid" alt="{{$destaque->titulo}}" src="/uploads/destaques/'.$destaque->foto.'">'  !!}
                    </div>
                @endforeach
            </div>
        </div>
    </div>

@endsection