templates/front/seminaire_inter.html.twig line 1

Open in your IDE?
  1. {% extends 'front.html.twig' %}
  3. {% block title %}Séminaires internationaux | CIMEF-INTERNATIONAL{% endblock %}
  4. {% block meta_description %}
  5. <meta name="description" content="Séminaires internationaux CIMEF : formations|certificats en commande publique, finances, projets, RH, IA, management à Paris, Abidjan, Dakar, Dubai, Shanghai et plus"/>
  6. <meta property="og:image" content="https://cimef-international.org/public/inter/LOGO CIMEF.jpg.jpeg">
  7. <meta property="og:url" content="https://cimef-international.org/formations/seminaires/internationaux">
  8. <meta property="og:type" content="website">
  9. {% endblock %}
  10. {% block styleSheets %}
  11. <style id='wp-emoji-styles-inline-css' type='text/css'>
  12.     #recherche_mot,.select2-container{width:95%!important}.select2-dropdown{z-index:999999!important}.search_archive_event{border:1px solid #fff!important}.form-control{width:95%;height:auto;padding:10px;border-radius:1px!important;font-family:arial;margin:10px;border:1px solid #ccc}.shadow{box-shadow:0 1px 4px 0 rgba(0,0,0,.1),0 3px 10px 0 rgba(0,0,0,.1)}.row{display:flex;flex-wrap:wrap;margin-right:-.75rem;margin-left:-.75rem}.events_pagination ul.pagination{display:flex;flex-wrap:wrap;justify-content:center;list-style:none;margin:0;padding:0}.page-item.active .page-link{background-color:#f60;color:#fff}.page-link{margin:10px;color:#051a53;background-color:#ededed;border-radius:5px;padding:10px}.text-lien{color:#f60}@media (min-width:576px){.col-3,.col-sm-12,.col-sm-4,.col-sm-6{flex:0 0 100%;max-width:100%}}@media (min-width:768px){.col-md-3,.col-md-4{flex:0 0 33.333333%;max-width:33.333333%}.col-md-6{flex:0 0 50%;max-width:50%}.col-md-12{flex:0 0 100%;max-width:100%}}@media (min-width:992px){.col-lg-3{flex:0 0 25%;max-width:25%}.col-lg-4{flex:0 0 33.333333%;max-width:33.333333%}.col-lg-6{flex:0 0 50%;max-width:50%}.col-lg-12{flex:0 0 100%;max-width:100%}}.type1 .date-event{transition:.5s;position:absolute;bottom:20px;left:30px;z-index:1;font-size:12px;color:#fff;font-weight:700;text-transform:uppercase;text-align:center;line-height:1.3;letter-spacing:1px;background-color:#f60!important;padding:12px}.icon_event{color:#f60!important}.btn-rechercher{margin-left:10px!important}.wrap_header_banner .overlay-slider{position:absolute;top:0;left:0;padding-top:30px;width:100%;height:100%;background-color:rgba(0,0,0,.6392156863)}.select2-container--default .select2-selection--single{text-transform:lowercase}.select2-container--default .select2-results__option{text-transform:uppercase}.select2-container--default .select2-selection__placeholder{text-transform:lowercase}#recherche_mot{border:2px solid #f60!important;border-radius:8px!important;height:45px!important;padding:10px!important}
  13. </style>
  14. <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
  15. {% endblock %}
  16. {% block body %}
  17. {% include 'section/navbar.html.twig' %}
  18. <div class="wrap_header_banner" style="height: 200px; background: url({{ asset('public/inter/table.jpeg')}});        
  19.         background-size: cover;
  20.         background-position: center;
  21.         background-repeat: no-repeat;">
  22.     <div class="overlay-slider">
  23.         <div class="row_site">
  24.             <div class="container_site">
  25.                 <div class="cover_color"></div>
  26.                 <div class="header_banner_el">
  27.                     <div class="header_breadcrumbs">
  28.                         <div id="breadcrumbs">
  29.                         <ul class="breadcrumb">
  30.                             <li><a href="{{ path('front.inter.index') }}" style="color: #fff!important;" title="accueil">Accueil</a></li>
  31.                             <li class="li_separator"><span class="separator"><i class="ovaicon-next" style="color: #fff!important;"></i></span></li>
  32.                             <li style="color: #fff!important;">Formations</li>
  33.                             <li class="li_separator"><span class="separator"><i class="ovaicon-next" style="color: #fff!important;"></i></span></li>
  34.                             <li style="color: #fff!important;">Séminaires Internationaux</li>
  35.                         </ul>
  36.                         </div>
  37.                     </div>
  38.                     <h1 class="header_title" style="color: #fff!important;">Séminaires Internationaux </h1>
  39.                 </div>
  40.             </div>
  41.         </div>
  42.     </div>
  43. </div>
  46. {% for message in app.flashes('success') %}
  47. <div class="row toast_success" style="padding: 10px; top: 100px !important; float: right !important; position: absolute;">
  48.     <div class="col-md-2 col-sm-2">
  49.         <i class="fa fa-check fa-2x" aria-hidden="true"></i>
  50.     </div>
  51.     <div class="col-md-10 col-sm-10">
  52.         <label style="font-family: arial;">{{ message }}</label>
  53.     </div>
  54. </div>    
  55. {% endfor %}
  56. {% for message in app.flashes('danger') %}
  57. <div class="row toast_danger" style="padding: 10px;top: 100px !important; float: right !important; position: absolute;">
  58.     <div class="col-md-2 col-sm-2">
  59.         <i class="fa fa-times fa-2x" aria-hidden="true"></i>
  60.     </div>
  61.     <div class="col-md-10 col-sm-10">
  62.         <label style="font-family: arial;">{{ message }}</label>
  63.     </div>
  64. </div>   
  65. {% endfor %}
  66. {% for message in app.flashes('warning') %}
  67. <div class="row toast_warning" style="padding: 10px; top: 100px !important; float: right !important; position: absolute;">
  68.     <div class="col-md-2 col-sm-2">
  69.         <i class="fa fa-exclamation-triangle fa-2x" aria-hidden="true"></i>
  70.     </div>
  71.     <div class="col-md-10 col-sm-10">
  72.         <label style="font-family: arial;">{{ message }}</label>
  73.     </div>
  74. </div>   
  75. {% endfor %}
  77. <div class="container-event">
  78.     <div id="main-event" class="content-event">
  79.         <div class="search_archive_event mb-4" style="margin-top: -50px !important;">
  80.             {{ form_start(recherche) }}
  81.             <div class="row shadow" style="margin-bottom: 20px !impirtant; width: 100%; padding: 10px !important; 
  82.                 border: 1px solid #cfcfcf; background-color: #F5F5F5 !important;">
  83.                 <div class="col-md-6 col-sm-12 p-3" style="padding: 10px !important; width: 100%;">
  84.                     {{ form_row(recherche.mot) }}
  85.                 </div>
  86.                 <div class="col-md-3 col-sm-12 p-3" style="padding: 10px !important;">{{ form_row(recherche.ville) }}</div>
  87.                 <div class="col-md-2 col-sm-12 p-3" style="padding: 10px !important; font-family: arial;">{{ form_widget(recherche.submit, {'attr': {'class': 'btn btn-primary btn-large'}}) }}</div>
  88.             </div>
  89.             {{ form_end(recherche) }}
  90.         </div>    
  91.             <div class="row">
  92.             {% if pagination != null %}
  93.                 {% for pag in pagination %}
  94.                 <div class="col-lg-3 col-md-3 col-sm-12" style="padding: 10px;">
  95.                     <div class="type1 mb-2">
  96.                         <div class="desc" style="border-radius: 5px;">
  97.                             <div class="event-thumbnail" style="height: 200px;">
  98.                                 <div class="date-event">
  99.                                     <span class="date">{{ annee }}</span>
  100.                                 </div>
  101.                                 {% if pag.image == null or pag.image == 'no-file' %}
  102.                                 <a href="{{ path('front.seminaire.inter.detail',{'slug': pag.theme.slug, 'id': pag.id})}}" aria-label="Event Thumbnail">
  103.                                     <img loading="lazy" width="600" height="400" src="https://demo.ovathemewp.com/gimont/wp-content/uploads/2023/06/event-01-600x400.jpg" 
  104.                                     class="attachment-ovaev_event_thumbnail size-ovaev_event_thumbnail wp-post-image" alt="{{ pag.theme.nom }}" decoding="async" 
  105.                                     srcset="https://demo.ovathemewp.com/gimont/wp-content/uploads/2023/06/event-01-600x400.jpg 600w, https://demo.ovathemewp.com/gimont/wp-content/uploads/2023/06/event-01-450x300.jpg 450w" sizes="(max-width: 600px) 100vw, 600px" />            
  106.                                 </a>
  107.                                 {% else %}
  108.                                     <a href="{{ path('front.seminaire.inter.detail',{'slug': pag.theme.slug, 'id': pag.id})}}" aria-label="Event Thumbnail">
  109.                                         <img loading="lazy" style="height: 300px !important;" src="{{ asset('public/uploads/images/formations/' ~ pag.image) }}" 
  110.                                         class="attachment-ovaev_event_thumbnail size-ovaev_event_thumbnail wp-post-image" alt="{{ pag.theme.nom }}" decoding="async" 
  111.                                         srcset="{{ asset('public/uploads/images/formations/' ~ pag.image) }}" sizes="(max-width: 600px) 100vw, 600px" />            
  112.                                     </a>
  113.                                 {% endif %}
  114.                             </div>
  116.                             <div class="event_post" style="margin-top: 10px; height: auto;">
  117.                                 <div class="meta-event">
  118.                                     <div class="time equal-date" style="height: 35px;">
  119.                                         <span class="icon-time">
  120.                                             <i class="fas fa-clock icon_event" aria-hidden="true"></i>
  121.                                         </span>
  122.                                         <span class="time-date-child">
  123.                                             <span class="date-child">{{ pag.getDatesSession() }}    {{ annee }}</span>
  124.                                         </span>
  125.                                     </div>
  126.                                     <div class="venue">
  127.                                         <i class="fas fa-map-marker-alt icon_event" aria-hidden="true"></i>
  128.                                         <span class="number">
  129.                                         {{ pag.ville.nom }}, {{ pag.ville.pays }}    </span>
  130.                                     </div>
  131.                                 </div>
  132.                                 <div style="height: 100px;">
  133.                                     <label class="second_font event_title" style="font-weight: bold; font-size: 14px !important;">
  134.                                         {% if pag.theme.nom|striptags|length > 50 %}
  135.                                             {{ pag.theme.nom|striptags|slice(0, 85) ~ '...' }}
  136.                                         {% else %}
  137.                                             {{ pag.theme.nom|striptags }}
  138.                                         {% endif %}
  139.                                     </label>
  140.                                 </div>
  141.                                 <div style="text-align: right;">
  142.                                     <a class="text-lien" href="{{ path('front.seminaire.inter.detail',{'slug': pag.theme.slug, 'id': pag.id})}}">En savoir plus</a>
  143.                                 </div>
  144.                             
  145.                             </div>
  146.                         </div>
  147.                     </div>
  148.                 </div>
  149.                 {% endfor %}
  150.             {% endif %}
  151.             </div>
  152.         
  153.         <div class="events_pagination justify-content-center mt-4">
  154.             {{ knp_pagination_render(pagination, '@KnpPaginator/Pagination/bootstrap_v5_pagination.html.twig') }}
  155.         </div>
  157.     </div>
  158. </div>
  163. {% include 'section/footer.html.twig' %}
  165. <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  166. <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
  168. <script>
  169.     document.addEventListener("DOMContentLoaded",()=>{let e=document.getElementById("theme-autocomplete"),t;e.addEventListener("input",async()=>{if(e.value.length<2)return;let a=await fetch("/ajax/themes?q="+e.value),n=await a.json();t&&t.remove(),(t=document.createElement("ul")).className="list-group position-absolute w-100",n.forEach(a=>{let n=document.createElement("li");n.className="list-group-item list-group-item-action",n.textContent=a.text,n.onclick=()=>{e.value=a.text,t.remove()},t.appendChild(n)}),e.parentNode.appendChild(t)}),document.addEventListener("click",()=>{t&&t.remove()})});
  170. </script>
  173. <script>
  174.     document.addEventListener("DOMContentLoaded",()=>{function e(){let e=document.getElementById("recherche_mot");e&&(e.classList.add("form-control","my-custom-class"),e.style.border="2px solid #ff6600")}e();let t=new MutationObserver(()=>{e()});t.observe(document.body,{childList:!0,subtree:!0}),document.querySelectorAll("select").forEach(function(e){$(e).select2({width:"100%",allowClear:!0})})});
  175. </script>
  179. {% endblock %}