@extends('layout.main')


@section('main-section')
    <!-- breadcrumb area start -->
    <div class="breadcrumb-area style-two jarallax" style="background-image:url({{ asset('resources/assets/img/bg/1.png') }});">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="breadcrumb-inner">
                        <h1 class="page-title">Destinations</h1>
                        <ul class="page-list">
                            <li><a href="{{ url('/') }}">Home</a></li>
                            <li>Destinations </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- breadcrumb area End -->

    <!-- destination area End -->
    <div class="destination-area">
        <div class="container-bg mg-top--70">
            <div class="container">
                <div class="row justify-content-center">
                    @foreach($destinationData as $destinationRow)
                    <div class="col-lg-4 col-md-6">
                        <div class="single-destination-grid text-center">
                            <div class="thumb">
                                <img src="{{ asset('/public/storage/'.$destinationRow->image) }}" alt="{{ $destinationRow->name }}"  style="width: 100%;">
                            </div>
                            <div class="details">
                                <div class="tp-review-meta">
                                    <i class="ic-yellow fa fa-star"></i>
                                    <i class="ic-yellow fa fa-star"></i>
                                    <i class="ic-yellow fa fa-star"></i>
                                    <i class="ic-yellow fa fa-star"></i>
                                    <i class="fa fa-star"></i>
                                    <span>4.0</span>
                                </div>
                                <h3 class="title">{{ $destinationRow->name }}</h3>
                                <p class="content">{{ $destinationRow->sub_description }}
                                </p>
                                <a class="btn btn-gray" href="{{ url('/destination/'.$destinationRow->id) }}"><span>Explore<i class="la la-arrow-right"></i></span></a>
                            </div>
                        </div>
                    </div>
                    @endforeach
                    <!--<div class="col-12">-->
                    <!--    <div class="btn-wrapper text-center">-->
                    <!--        <a class="btn btn-yellow mt-4" href="#"><span>Read More<i class="la la-arrow-right"></i></span></a>-->
                    <!--    </div>-->
                    <!--</div>-->
                </div>
            </div>
        </div>
    </div>
    <!-- destination area End -->
@endsection