@extends('theme')
@section("title", env('APP_NAME')." - Início")
@section('content')

    @include('components._header',["img" => "assets/imgs/botinas.jpg", "title" => __("Roteiros turísticos")])

    <main>

        <div class="container galeria-pontos-turisticos">

            <div class="chrumb-share" style="margin-top: 50px;">

                <div class="breadcrumb">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="{{ route("home") }}"><i class="fas fa-home"></i> {{ __("Início") }}</a></li>
                            <li class="breadcrumb-item active" aria-current="page"><strong style="font-weight: normal">{{ __("Roteiros Turísticos") }}</strong></li>
                        </ol>
                    </nav>
                </div>

                <div class="share">
                    <span>{{ __("Compartilhar:") }} </span> <a data-bs-toggle="modal" data-bs-target="#exampleModal" class="share-link"><img src="{{ asset("assets/imgs/share.png") }}" class="share-icon"></a>
                </div>

            </div>

            <div class="row">
                <div class="col">
                    <h2>{{ __("Nossos Roteiros turísticos") }}</h2> 
                    <div class="flex-container">

                        @foreach($corredores as $corredor)

                            <figure data-aos="fade-up" data-aos-duration="1000" data-aos-offset="0">
                                <a href="{{ route("pages.roteiro-turistico", $corredor->slug) }}" style="background-image: url({{ env("APP_ASSET"). '/' . $corredor->foto }})">

                             <figcaption>
                                    <div class="fig-title">{{ str_replace(['Corredor', 'corredor', 'CORREDOR'], ['Roteiro', 'roteiro', 'ROTEIRO'], $corredor->corredor) }}</div>
                                </figcaption>
                            </a>
                        </figure>

                    @endforeach

                </div>
            </div>
        </div>

    </main>

@endsection