@extends('front.layouts.app')
@section('title','Nos projets')
@section('content')
    <!--== Start Page Title Area ==-->
    <x-title image="{{$project->getFirstMediaUrl('project')}}" page="{{$project->name}}"/>
    <!--== End Page Title Area ==-->

    <!-- Start Portfolio
   ============================================= -->
    <div class="portfolio-details default-padding">
        <div class="container">
            <div class="row">
                <div class="col-md-12 carousel">
                    <div class="pf-thum-carousel owl-carousel owl-thumb">
                        <img src="{{asset($project->getFirstMediaUrl('project'))}}" alt="Thumb">
                    </div>
                </div>
                <div class="col-md-12 conetnt">
                    <h2>{{$project->name}}</h2>

                    {!! $project->description  !!}

                </div>
                <div class="col-md-12 portfolio-area related-projects default-padding-top">
                    <div class="heading">
                        <h3>Images du projet</h3>
                    </div>
                    <div class="related-project-items owl-carousel owl-theme">
                        @foreach($project->getMedia('project-images') as $image)
                        <div class="pf-item">
                            <div class="item-inner">
                                <img src="{{asset($image->getUrl())}}" alt="Thumb"/>
                                <div class="overlay">
                                    <div class="view-list">
                                        <a href="{{asset($image->getUrl())}}" class="item popup-link"><i class="fa fa-eye"></i></a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        @endforeach

                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- End Portfolio -->

@endsection