@extends('app')


<!--**********************************
   lien css ou js -- header
***********************************-->

@section('header')
{{-- <link rel="icon" type="image/png" sizes="16x16" href="{{asset('assets/images/favicon.png')}}"> --}}
<link rel="stylesheet" href="{{asset('assets/vendor/chartist/css/chartist.min.css')}}">
<link href="{{asset('assets/vendor/bootstrap-select/dist/css/bootstrap-select.min.css')}}" rel="stylesheet">
<link href="{{asset('assets/vendor/datatables/css/jquery.dataTables.min.css')}}" rel="stylesheet">
<link href="{{asset('assets/css/style.css')}}" rel="stylesheet">
@endsection

<!--**********************************
   fin lien css ou js -- header
***********************************-->




<!-- **********************************
    body
*********************************** -->
@section('content')

@include('app.habilitation.modals.add_habilitation')
<div class="container-fluid">
    <div class="row">
        <div class="col-xl-12">
            <div class="card">
                <div class="card-body d-flex justify-content-between align-items-center">
                    <div>
                        <h4>Liste des habilitations</h4>
                        <span></span>
                    </div>
                    <a href="javascript:void(0);" class="btn btn-info light"  data-toggle="modal" data-target="#reviewModalADDHabilitation">+ Habilitation</a>
                </div>
            </div>
        </div>
        <div class="col-xl-3 col-xxl-4 col-sm-6">
            <div class="card user-card">
                <div class="card-body pb-0">
                    <div class="d-flex mb-3 align-items-center">
                        <div class="dz-media mr-3 rounded-circle">
                            <img src="{{asset('assets/images/users/pic2.jpg')}}" alt="">
                        </div>
                        <div>
                            <h5 class="title"><a href="javascript:void(0);">Oliver Jean</a></h5>
                            <span class="text-info">Mantenancier</span>
                        </div>
                    </div>
                    <p class="fs-12">Maintain inventory of supplies and order new stock as needed Maintain inventory stock</p>
                    <ul class="list-group list-group-flush">
                        <li class="list-group-item">
                            <span class="mb-0 title">Email</span> :
                            <span class="text-black ml-2">example@gmail.com</span>
                        </li>
                        <li class="list-group-item">
                            <span class="mb-0 title">Téléphone</span> :
                            <span class="text-black ml-2">1238545644</span>
                        </li>
                        <li class="list-group-item">
                            <span class="mb-0 title">Location</span> :
                            <span class="text-black desc-text ml-2">Indonasia</span>
                        </li>
                        <li class="list-group-item">
                            <span class="mb-0 title">La date d'obtention</span> :
                            <span class="text-black desc-text ml-2">20-01-2024</span>
                        </li>
                        <li class="list-group-item">
                            <span class="mb-0 title">La date d'expiration</span> :
                            <span class="text-black desc-text ml-2">20-05-2024</span>
                        </li>
                    </ul>
                </div>
                <div class="card-footer">
                    <a href="javascript:void(0);" class="btn btn-primary btn-xs">Write Message</a>
                </div>
            </div>
        </div>
       
        <div class="col-xl-3 col-xxl-4 col-sm-6">
            <div class="card user-card">
                <div class="card-body pb-0">
                    <div class="d-flex mb-3 align-items-center">
                        <div class="dz-media rounded-circle mr-3">
                            <span class="icon-placeholder bgl-success text-success">km</span>
                        </div>
                        <div>
                            <h5 class="title"><a href="javascript:void(0);">Kevin Mandala</a></h5>
                            <span class="text-danger">Electricien</span>
                        </div>
                    </div>
                    <p class="fs-12">Answering guest inquiries, directing phone calls, coordinating travel plans, and more.</p>
                    <ul class="list-group list-group-flush">
                        <li class="list-group-item">
                            <span class="mb-0 title">Email</span> :
                            <span class="text-black ml-2">example@gmail.com</span>
                        </li>
                        <li class="list-group-item">
                            <span class="mb-0 title">Téléphone</span> :
                            <span class="text-black ml-2">1238545644</span>
                        </li>
                        <li class="list-group-item">
                            <span class="mb-0 title">Location</span> :
                            <span class="text-black desc-text ml-2">Indonasia</span>
                        </li>
                        <li class="list-group-item">
                            <span class="mb-0 title">La date d'obtention</span> :
                            <span class="text-black desc-text ml-2">20-01-2024</span>
                        </li>
                        <li class="list-group-item">
                            <span class="mb-0 title">La date d'expiration</span> :
                            <span class="text-black desc-text ml-2">20-05-2024</span>
                        </li>
                    </ul>
                </div>
                <div class="card-footer">
                    <a href="javascript:void(0);" class="btn btn-info btn-xs">Write Message</a>
                </div>
            </div>
        </div>
       
    </div>
    <nav>
        <ul class="pagination pagination-gutter pagination-primary no-bg">
            <li class="page-item page-indicator">
                <a class="page-link" href="javascript:void(0)">
                    <i class="la la-angle-left"></i></a>
            </li>
            <li class="page-item "><a class="page-link" href="javascript:void(0)">1</a>
            </li>
            <li class="page-item active"><a class="page-link" href="javascript:void(0)">2</a></li>
            <li class="page-item"><a class="page-link" href="javascript:void(0)">3</a></li>
            <li class="page-item"><a class="page-link" href="javascript:void(0)">4</a></li>
            <li class="page-item page-indicator">
                <a class="page-link" href="javascript:void(0)">
                    <i class="la la-angle-right"></i></a>
            </li>
        </ul>
    </nav>
</div>
@endsection
<!--**********************************
    fin body
***********************************-->






<!--**********************************
    lien js -- footer
***********************************-->
@section('footer')
     <!-- Required vendors -->
     <script src="{{asset('assets/vendor/global/global.min.js')}}"></script>
     <script src="{{asset('assets/vendor/bootstrap-select/dist/js/bootstrap-select.min.js')}}"></script>
    
     
     <script src="{{asset('assets/vendor/chart.js/Chart.bundle.min.js')}}"></script>
     <script src="{{asset('assets/vendor/datatables/js/jquery.dataTables.min.js')}}"></script>
     <script src="{{asset('assets/js/plugins-init/datatables.init.js')}}"></script>

     <script src="{{asset('assets/vendor/star-rating/jquery.star-rating-svg.js')}}"></script>
     <script src="{{asset('assets/js/custom.min.js')}}"></script>
     <script src="{{asset('assets/js/deznav-init.js')}}"></script>
@endsection

<!--**********************************
    fin lien  -- footer
***********************************-->