@extends('base')

@section('content')

    <div class="container">
        <h1 class="display-3 text-center">Repertoire des membres</h1>
        {{-- Pour afficher en ligne et les centrer au niveau de la page --}}
        <div class="articles row justify-content-center">
            @foreach ($membres as $membre)
                {{-- une div qui prend la moitié de la page --}}
                <div class="col-md-6">
                    {{-- Correction de Arsene --}}

                    <div class="card my-3">
                        <div class="container wrapper">
                            <div class="row">

                                <div class="col-md-6 my-2">
                                    <img src="{{ asset($membre->photoProfil) }}" class="img-fluid" alt="imagess"/>

                                </div>

                                <div class="col-md-6">
                                    <p class="card-text my-2">Prénom : {{ $membre->lastName }} </p>
                                    <p class="card-text">Nom : {{ $membre->firstName }} </p>
                                    <p class="card-text">Date de naissance : {{ $membre->birthdateFormatted() }} </p>
                                    <a href="{{ route('membre', $membre->slug) }}" class="btn btn-primary">
                                        Afficher plus
                                        <i class=" fas fa-arrow-right"></i>
                                    </a>

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

                </div>
            @endforeach
            <div class="d-flex justify-content-center mt5">
                {{ $membres->links('vendor.pagination.custom') }}
            </div>
        </div>
    @endsection