{% extends 'front.html.twig' %}
{% block title %} Annuaire {% endblock %}
{% block stytesheets %}

    {{ parent() }}

{% endblock %}
{% block body %}


    <div class="main-content">
        <section class="inner-header divider parallax layer-overlay overlay-white-8">
            <div class="container pt-60 pb-60">
                <!-- Section Content -->
                <div class="section-content">
                    <div class="row">
                        <div class="col-md-12 text-center" style="margin-top: -45px;">
                            <h2 class="title bg-text-new">Annuaire</h2>
                            <ol class="breadcrumb text-center text-black mt-10">
                                <li><a href="{{ path('home') }}">Accueil</a></li>
                                <li class="bg-text-new">Annuaire</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
        </section>


        <!-- Content Annuaire Start -->
        <div class="container">
            <section id="">
                <div class="container pb-80">
                    <section>
                        <div class="row " id="searchAnnuaire">
                            <div class="col-md-6 col-md-offset-3">
                                <!-- Mailchimp Subscription Form-->
                                <form id="" class="newsletter-form mt-80" method="get"
                                      action="{{ path('admin_annuaire_search') }}">
                                    <label for="mce-EMAIL"></label>
                                    <div class="input-group">
                                        <input type="text" id="search" data-path="{{ path('admin_annuaire_search') }}"
                                               data-height="45px" class="form-control input-search input-lg" placeholder="Recherche"
                                               name="search" value="">
                                        <span class="input-group-btn">
                                  <button type="submit" id="btn-search" class="btn btn-colored btn-dark btn-lg m-0"
                                          data-height="45px"><i class="fa fa-search"></i> </button>
                                </span>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </section>

                    <div class="section-content mt-100">
                        <div class="ResultFiltre">
                            <div class="row">

                                {% if nbrAnnuaire == 0 %}
                                    <section class="noData">
                                        <div class="section-title text-center">
                                            <div class="row">
                                                <div class="col-md-8 col-md-offset-2">
                                                    <h2 class="text-uppercase mt-0 line-height-1">Aucune <span class="text-theme-colored2">donnée disponible</span>
                                                    </h2>
                                                </div>
                                            </div>
                                        </div>
                                    </section>
                                {% else %}
                                    {% for annuaire in annuaires %}
                                        {#hvr-float-shadow#}
                                        <div class="col-xs-12 col-sm-6 col-md-4  wow fadeInLeft animation-delay1 bloAnnuaire"
                                             style="margin-bottom: 20px">
                                            <div class="pricing-table style1 bg-white-light text-center" id="blogannuaire">
                                                <div class="pricing-icon">
                                                    <i class="flaticon-medical-medical51"></i>
                                                </div>
                                                <div style="padding-top: 10px;">
                                                    <h3 class="package-type mt-0 font-24 text-uppercase">
                                                        Dr.{{ annuaire.lastName }} {{ annuaire.firstName }}</h3>

                                                    <ul class="list-inline mt-5">
                                                        <li class="title mt-0"><i class="fa fa-briefcase text-theme-colored" ></i> {{ annuaire.specialite }}</li><br>
                                                        <li class="title mt-0"><i class="fa fa-briefcase text-theme-colored" ></i> {{ annuaire.function }}</li><br>
                                                        <li class=""><i class="fa fa-phone text-theme-colored"></i>
                                                            <a href="" class="text-gray">{{ annuaire.phone }}</a></li>
                                                        <br>
                                                        <li class=""><i class="fa fa-envelope-o text-theme-colored"></i> <a
                                                                    href="" class="text-gray">{{ annuaire.email }}</a></li><br>
                                                        <li><i class="fa fa-map-marker text-theme-colored"></i> {{ annuaire.address }} </li><br>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                    {% endfor %}
                                {% endif %}
                                <section class="container">
                                    <div class="row price_padng pull-down-20 pull-right">
                                        <div class="col-md-12 col-xs-12">
                                            <nav class="pdg-tp-20 " aria-label="Page navigation">
                                                {{ knp_pagination_render(annuaires) }}
                                            </nav>
                                        </div>
                                    </div>
                                </section>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        </div>

        <!-- Content Section End -->
    </div>



{% endblock %}

        {% block javascripts %}
            {{ parent() }}
        {% endblock %}