{% extends 'admin.html.twig' %}

{% block title %}{{ 'articleAdherent.list.title1'| trans }}{% endblock %}
{% block stylesheets %}
    {{ parent() }}

    <style>
        .pagination{
            display: block !important;
        }
        .pagination > ul {
            border-radius: 3px;
            display: flex;
            padding-left: 0;
            list-style: none;
        }
        .pagination ul li.active a {
            border-color: #f90000;
            background: #EE7A00;
            color: #FFF;


        }
        .pagination > ul > li > a{
            margin-right: 5px;
            border-radius: 3px!important;

            padding: 10px;
            line-height: 20px;
            min-width: 40px;
            text-align: center;
            color: #323c47;
            border-color: #d7dde3;
            outline: 0;
            background: #FFF;
            -moz-transition: all .2s ease-in-out;
            -o-transition: all .2s ease-in-out;
            -webkit-transition: all .2s ease-in-out;
            transition: all .2s ease-in-out;
        }
    </style>

{% endblock %}

{% block body %}
    <div class="content" id="content"><!-- PAGE HEADING -->
        <div class="page-heading">
            <div class="page-heading__container">
                <div class="icon"><span class="li-expand4"></span></div>
                <h1 class="title">{{ 'articleAdherent.list.title2'| trans }}</h1>
            </div>
            <nav aria-label="breadcrumb" role="navigation">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="#">
                            {% if role == 'admin' %}
                                {{ 'adminMenu.title1.admin' |trans }}
                            {% elseif role=='be' %}
                                {{ 'adminMenu.title1.be' |trans }}
                            {% elseif role == 'super' %}
                                {{ 'adminMenu.title1.super' |trans }}
                            {% else %}
                                {{ 'adminMenu.title1.adh' |trans }}
                            {% endif %}</a>
                    </li>
                    <li class="breadcrumb-item"><a href="#">{{ 'articleAdherent.list.title3'| trans }}</a></li>
                    <li class="breadcrumb-item active">{{ 'editUser.index.title2' | trans }}</li>
                </ol>
            </nav>
        </div><!-- //END PAGE HEADING -->
        <div class="container-fluid">
            <div class="card loaded" id="dt-ext-class">
                <div class="card-body">
                    <p class="subtitle margin-bottom-20"></p>
                    <div id="dt-example-class_wrapper" class="dataTables_wrapper container-fluid dt-bootstrap4">
                        <div class="row">
                            <div class="col-sm-12">
                                <div class="row">
                                    {% if article_adherents != null %}
                                        {% for article_adherent in article_adherents %}
                                        <div class="col-12 col-lg-4">
                                            <div class="card">
{#                                                <img class="card-img-top" src="{{ asset('uploads/article_adherent/'~article_adherent.picture) }}" alt="Card image cap">#}
                                                <div style="-webkit-background-size: cover;
                                                        background: url('{{ asset('uploads/article_adherent/'~article_adherent.picture) }}') no-repeat center;
                                                        background-size: cover!Important;height: 200px"></div>
                                                <div class="card-body">
                                                    <h4 class="card-title">{{ article_adherent.title }}</h4>
                                                    <p class="card-text">{{ article_adherent.content[:100]|raw }}</p>
                                                    <a href="{{ path('show_article_adherent',{'token':article_adherent.token,'role':role}) }}" class="btn btn-primary">{{ 'adh.index.title1' | trans }}</a>
                                                </div>
                                            </div>
                                        </div>
                                        {% endfor %}
                                    {% else %}
                                        <p class="card-text">{{ 'adh.index.title2' | trans }}</p>
                                    {% endif %}
                                </div>
                                <div class="row">
                                    <div class="col-md-12">
                                        {{ knp_pagination_render(article_adherents) }}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}
{% block javascripts %}
    {{ parent() }}
    {% block javascriptPage %}
        <!-- THIS PAGE SCRIPTS ONLY -->
        <script type="text/javascript" src="{{ asset('js/vendors/lightbox/lightbox.js') }}"></script>
        <!-- //END THIS PAGE SCRIPTS ONLY -->
    {% endblock %}
    {% include '@BackBundle/ArticleAdherent/bibliotheque/assets.html.twig' %}
{% endblock %}