@props(['titre'=>'Titre','routeSearch'=>'','routeCreate'=>'','liste'=>array(),'pagination'=>''])
<x-layout-base :titre="$titre">
        <div class="flex flex-wrap items-center">
            <div class="flex-grow">
                <x-recherche :route="$routeSearch"/>
            </div>
            <div class="p-5 gap-5 flex content-start items-center flex-wrap">
                <a href="{{$routeCreate}}">
                    <x-secondary-button>
                        <span class="fas fa-plus mr-2"></span>
                        {{$titre}}
                    </x-secondary-button>
                </a>
                @if(isset($otherButton)){{$otherButton}}@endif
            </div>
        </div>
        
        <div id="liste" class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-7">
            {!! $liste !!} 
        </div>
        
        <div id="pagination" class="p-5 sm:px-6 lg:px-8">{!! $pagination !!}</div>
</x-layout-base>