{% extends 'frontend/frontindex/add.html.twig' %}{% block seo %} {{ render(path( 'seo', { 'page':5 } )) }}{% endblock %}{% block css %} {{parent()}} <style> #readmore, #readlessbtn { display: none; } html { scroll-behavior: smooth; } </style>{% endblock %}{% block body %} {# <section class="breadcrumbs" style="background-image:url('../front-assets/assets/img/breadcrumb-bg.jpg')"> <div class="container"> <div class="row"> <div class="col-lg-6 offset-lg-3 col-12"> <div class="breadcrumb-content"> <h4>{{'%Comite%'|trans}}</h4> <ul class="breadcrumb-menu"> <li> <a href="{{path('app_accueil')}}">{{'%Home%'|trans}}</a> <i class="fa fa-angle-double-right"></i> </li> <li class="text-white" id="titleRules">{{'%Comite%'|trans}}</li> </ul> </div> </div> </div> </div> </section> #} <section class="service-area p-5"> <div class="container"> <div class="row"> <div class="col-lg-8 offset-lg-2 col-12"> <div class="section-title"> <h1>{{'%Comite%'|trans}}</h1> </div> </div> </div> <div class="row"> <div class="col-5"> <div class="list-group " id="list-tab" role="tablist"> <a class="list-group-item list-group-item-action active" id="list-reglement-list" data-toggle="list" href="#list-reglement" role="tab" aria-controls="reglement"> <strong>{{'%reglementInterne%'|trans}}</strong> </a> {% for key, memberComiteCategorie in memberComiteCategories %} <a class="list-group-item list-group-item-action" id="list-{{memberComiteCategorie.id}}-list" data-toggle="list" href="#list-{{memberComiteCategorie.id}}" role="tab" aria-controls="{{memberComiteCategorie.id}}"> {% if app.request.locale =='fr' %} {{memberComiteCategorie.titre}} {% elseif app.request.locale =='en' %} {{memberComiteCategorie.title}} {% endif %} </a> {% endfor %} </div> </div> <div class="col-7"> <div class="tab-content" id="nav-tabContent"> {% for key, memberComiteCategorie in memberComiteCategories %} <div class="tab-pane fade" id="list-{{memberComiteCategorie.id}}" role="tabpanel" aria-labelledby="list-{{memberComiteCategorie.id}}-list"> <h2 class="text-center pb-3"> {% if app.request.locale =='fr' %} {{memberComiteCategorie.titre}} {% elseif app.request.locale =='en' %} {{memberComiteCategorie.title}} {% endif %} </h2> <table class="table table-striped table-bordered"> <tr> <td> <strong> {{'%President%'|trans|capitalize}}:</strong> </td> <td>{{memberComiteCategorie.NomPresident}} {{memberComiteCategorie.PrenomPresident}}</td> </tr> <tr rowspan="2"> <td> <p> <strong>{{'%membres%'|trans|capitalize}}:</strong> </p> </td> <td> <div class="row"> {% for memberComite in memberComites %} {% if memberComite.categorieMemnbreComite.id == memberComiteCategorie.id %} <div class="col-lg-6 col-md-6 col-12"> <ul> <li> <i class="far fa-check"></i> {{memberComite.nom}} {{memberComite.prenom}}</li> </ul> </div> {% endif %} {% endfor %} </div> </td> </tr> </table> </div> {% endfor %} <div class="tab-pane fade show active" id="list-reglement" role="tabpanel" aria-labelledby="list-reglement-list"> <h2 class="text-center pb-3">{{'%reglementInterne%'|trans|capitalize}}</h2> <ul class="ml-5 mt-4 policy-list"> <li> <i class="fa fa-check"></i> {{'%P1Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P2Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P3Statut%'|trans}} </li> </ul> <a id="readmorebtn" href="javascript:void(0)" class="ml-5">{{'%LirePlus%'|trans}} <i class="fa fa-angle-down"></i> </a> <ul id="readmore" class="ml-5"> <li> <i class="fa fa-check"></i> {{'%P4Statut%'|trans}} : {{'%P5Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P6Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P7Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P8Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P9Statut%'|trans}} : {{'%P10Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P11Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P12Statut%'|trans}} : {{'%P13Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P14Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P15Statut%'|trans}} : {{'%P16Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P17Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P18Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P19Statut%'|trans}} </li> <li> <i class="fa fa-check"></i> {{'%P20Statut%'|trans}} </li> </ul> <a id="readlessbtn" href="#titleRules" class="ml-5">{{'%LireMoins%'|trans}} <i class="fa fa-angle-up"></i> </a> </div> </div> </div> </div> </div> </section>{% endblock %}{% block js %} {{parent()}} <script type="text/javascript"> $(document).ready(function () { $('#readmorebtn').click(function () { $('#readmore').show('normal'); $('#readlessbtn').show('normal'); $('#readmorebtn').hide(); }); $('#readlessbtn').click(function () { $('#readmore').hide(); $('#readmorebtn').show('normal'); $('#readlessbtn').hide(); window.scrollTo({top: 100, left: 100, behavior: 'smooth'}); }); }); </script>{% endblock %}