templates/default/actualites.html.twig line 1

Open in your IDE?
  1. {# BASE LOAD #}
  2. {% extends 'base.html.twig' %}
  4. {# TITLE TOP PAGE #}
  5. {% block title %}CPI | {% if app.request.locale == 'fr' %}Actualités{% else %}News{% endif %}{% endblock %}
  7. {# CSS #}
  8. {% block stylesheet %}
  10.          <link rel="stylesheet" href="{{ asset('css/actualites.css')}}">
  12. {% endblock %}
  14. {# BODY HOME PAGE #}
  15. {% block body %}
  17. <style>
  18.   
  19. </style>
  20. {% set catSelected = app.request.query.get('categorie') %}
  23.     <main>
  24.         <div class="accueil" style="padding-top: 237px;">
  25.             <div class="container text-light">
  26.                 <div class="row py-5 noBottom">
  27.                     <div class="col-12">
  28.                         <h1 data-aos="fade-right" data-aos-duration="1000" class="opensans_bold_50">{% trans %}titre-actualites{% endtrans %}{% if app.user %}<a href="{{path('app_dictionnaire_edit',{'id':118})}}"><button type="button"  style="margin-left:5px" class="btn btn-warning"  ><i class="fa-solid fa-pen"></i></button></a>{% endif %}</h1>
  29.                         <div class="col-lg-4">
  30.                             <div class="traitBlanc"></div>
  31.                         </div>
  32.                     </div>
  33.                 </div>
  34.                 <div class="dropdowns">
  35.                     <div class="row">
  36.                         <div class="col-12">
  37.                             <div class="row mb-5">
  38.                                 <div class="col-12 col-md-3">
  39.                                     <!-- Date Filter Dropdown -->
  40.                                         <div data-aos="fade-up" data-aos-duration="1200" class="dropdown " style="z-index:5">
  41.                                             <button class="btn dropdown-toggle margeButton d-flex justify-content-between" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
  42.                                                 {% if app.request.get('date') is not empty  %}
  43.                                                     {% if app.request.get('date') == 'mois'%}
  44.                                                         {% if app.request.locale == 'fr' %}Sur le dernier mois{% else %}Over the last month{% endif %} 
  45.                                                     {% endif %}
  46.                                                     {% if app.request.get('date') == 'annee'%}
  47.                                                         {% if app.request.locale == 'fr' %}La dernière année{% else %}The last year{% endif %} 
  48.                                                         
  49.                                                     {% endif %}
  50.                                                 {% else %}Date{% endif %}
  51.                                             </button>
  52.                                            <ul class="dropdown-menu">
  53.                                                 <li>
  54.                                                     <a style="font-weight:600;" class="dropdown-item text-light" href="{{ path('app_actualites', {'date': '','categorie': catSelected, 'locale': app.request.locale}) }}#jobsList">
  55.                                                         {% if app.request.locale == 'fr' %}Toutes les dates{% else %}All dates{% endif %} 
  56.                                                     </a>
  57.                                                 </li>
  58.                                                 <li>
  59.                                                     <a class="dropdown-item text-light" href="{{ path('app_actualites', {'date': 'mois', 'categorie': catSelected, 'locale': app.request.locale}) }}">
  60.                                                         {% if app.request.locale == 'fr' %}Sur le dernier mois{% else %}Over the last month{% endif %}
  61.                                                     </a>
  62.                                                 </li>
  63.                                                 <li>
  64.                                                     <a class="dropdown-item text-light" href="{{ path('app_actualites', {'date': 'annee', 'categorie': catSelected, 'locale': app.request.locale}) }}">
  65.                                                         {% if app.request.locale == 'fr' %}La dernière année{% else %}The last year{% endif %}
  66.                                                     </a>
  67.                                                 </li>
  68.                                             </ul>
  69.                                         </div>
  71.                                 </div>
  73.                                 <style>
  74.                                     .btn-dangerr{
  75.                                         background-color:white!important;
  76.                                         font-weight:bold!important;
  77.                                         color:#30278E!important;
  78.                                         width:auto!important;
  79.                                     }
  80.                                 </style>
  83.                                 <div class="col-12 col-md-3 margeButton " style="position: relative; bottom: 15px;z-index:4">
  84.                                     <div data-aos="fade-up" data-aos-duration="1000" class="dropdown my-3">
  85.                                        <button class="btn {{ catSelected ? 'btn-dangerr' : 'btn-secondary' }} dropdown-toggle d-flex justify-content-between" type="button" id="dropdownMenuButtonType" data-bs-toggle="dropdown" aria-expanded="false">
  86.                                             {% if catSelected %}
  87.                                                 {% for res in cat %}
  88.                                                     {% if res.id == catSelected  %}
  89.                                                         {% set title = app.request.locale == 'fr' ? res.titreFr : res.titreEn %}
  90.                                                         {{ title|length > 10 ? title|slice(0, 11) ~ '...' : title }}
  91.                                                     {% endif %}
  92.                                                 {% endfor %}
  93.                                             {% else %}
  94.                                                 {% set defaultTitle = app.request.locale == 'fr' ? 'Catégories' : 'Categories' %}
  95.                                                 {{ defaultTitle|length > 10 ? defaultTitle|slice(0, 11) ~ '...' : defaultTitle }}
  96.                                             {% endif %}
  97.                                         </button>
  99.                                          <ul class="dropdown-menu">
  100.                                             <li>
  101.                                                 <a style="font-weight:600;" class="dropdown-item text-light" href="{{ path('app_actualites', {'categorie': '', 'date': app.request.get('date'), 'locale': app.request.locale}) }}#jobsList">
  102.                                                     {% if app.request.locale == 'fr' %}Toutes les catégories{% else %}All categories{% endif %}
  103.                                                 </a>
  104.                                             </li>
  105.                                             {% for res in cat %}
  106.                                                 <li>
  107.                                                     <a class="dropdown-item text-light" href="{{ path('app_actualites', {'categorie': res.id, 'date': app.request.get('date'), 'locale': app.request.locale}) }}">
  108.                                                         {% if app.request.locale == 'fr' %}{{ res.titreFr }}{% else %}{{ res.titreEn }}{% endif %}
  109.                                                     </a>
  110.                                                 </li>
  111.                                             {% endfor %}
  112.                                         </ul>
  113.                                         </div>
  114.                                 </div>
  118.                                 <div data-aos="fade-up" data-aos-duration="1600" class="col-12 col-md-3 margeButton" style="z-index:4">
  119.                                  
  120.                                 </div>
  121.                                 <div class="col-12 col-md-3 margeButton">
  122.                                     <div data-aos="fade-up" data-aos-duration="1800" class="dropdown ">
  123.                                         <a href="{{path('app_actualites',{'locale':app.request.locale})}}"><button class="btn btn-secondary btn-res d-flex justify-content-between" type="button">
  124.                                           
  125.                                            <p style="margin-bottom: 0;"> <i class="fas fa-arrows-rotate" aria-hidden="true" style="margin-right:10px"></i>{% if app.request.locale == 'fr' %}Réinitialiser{% else %}Reset{% endif %}</p>
  126.                                         </button></a>
  127.                                        
  128.                                     </div>
  129.                                 </div>
  130.                             </div>
  131.                         </div>
  132.                     </div>
  133.                 </div>
  136.             </div>
  137.         </div>
  138.         <div class="accueil2" style="margin-top:30px;">
  139.             <div class="container">
  140.                 <div class="row">
  141.                     <div class="col-12">
  143.                     {% set lastsIds = lasts|map(last => last.id) %}
  145.                     {% for last in lasts %}
  146.                         <div class="row">
  147.                             <div class="col-lg-5 pb-5 lastActu noBottom align-self-center order-last order-lg-first">
  148.                             {% if app.request.locale == 'fr' %}
  149.                                 {% set titreNew = last.titreFr|replace({' ':'_'}) %}
  150.                             {% else %}
  151.                                 {% set titreNew = last.titreEn|replace({' ':'_'}) %}
  152.                             {% endif %}
  153.                                 <a href="{{path('actualitesD',{'id':last.id, 'titre': titreNew,'locale':app.request.locale})}}">
  154.                                     <div class="texte-carte">
  155.                                         <div class="titre" style="font-size: 36px!important;">
  156.                                                  <p data-aos="fade-right" data-aos-duration="1000" style="min-height:145px"> {% if app.request.locale == 'fr' %}{{last.titreFr|slice(0,90)}}{% else %}{{last.titreEn|slice(0,90)}}{% endif %} ...</p>
  157.                                             </div>
  158.                                            
  159.                                         <div data-aos="fade-right" data-aos-duration="1000" class="date">
  160.                                             <img src="{{asset('img/actualites/clock.png')}}" alt="clock" style="">
  161.                                             <p>
  162.                                             {{last.date|date('d')}}
  164.                                                         {% if app.request.locale == 'fr' %}
  165.                                                             {% if last.date|date('m') == '01' %}JANVIER{% endif %}
  166.                                                             {% if last.date|date('m') == '02' %}FEVRIER{% endif %}
  167.                                                             {% if last.date|date('m') == '03' %}MARS{% endif %}
  168.                                                             {% if last.date|date('m') == '04' %}AVRIL{% endif %}
  169.                                                             {% if last.date|date('m') == '05' %}MAI{% endif %}
  170.                                                             {% if last.date|date('m') == '06' %}JUIN{% endif %}
  171.                                                             {% if last.date|date('m') == '07' %}JUILLET{% endif %}
  172.                                                             {% if last.date|date('m') == '08' %}AOUT{% endif %}
  173.                                                             {% if last.date|date('m') == '09' %}SEPTEMBRE{% endif %}
  174.                                                             {% if last.date|date('m') == '10' %}OCTOBRE{% endif %}
  175.                                                             {% if last.date|date('m') == '11' %}NOVEMBRE{% endif %}
  176.                                                             {% if last.date|date('m') == '12' %}DECEMBRE{% endif %}
  177.                                                         {% else %}
  178.                                                             {% if last.date|date('m') == '01' %}JANUARY{% endif %}
  179.                                                             {% if last.date|date('m') == '02' %}FEBRUARY{% endif %}
  180.                                                             {% if last.date|date('m') == '03' %}MARCH{% endif %}
  181.                                                             {% if last.date|date('m') == '04' %}APRIL{% endif %}
  182.                                                             {% if last.date|date('m') == '05' %}MAY{% endif %}
  183.                                                             {% if last.date|date('m') == '06' %}JUNE{% endif %}
  184.                                                             {% if last.date|date('m') == '07' %}JULY{% endif %}
  185.                                                             {% if last.date|date('m') == '08' %}AUGUST{% endif %}
  186.                                                             {% if last.date|date('m') == '09' %}SEPTEMBER{% endif %}
  187.                                                             {% if last.date|date('m') == '10' %}OCTOBER{% endif %}
  188.                                                             {% if last.date|date('m') == '11' %}NOVEMBER{% endif %}
  189.                                                             {% if last.date|date('m') == '12' %}DECEMBER{% endif %}
  192.                                                         {% endif %}
  195.                                                             {{last.date|date('Y')}}
  196.                                             </p>
  197.                                         </div>
  198.                                      <div class="description "style="font-size: 21px!important;">
  199.                                                <p data-aos="fade-right" data-aos-duration="1000">{% if app.request.locale == 'fr' %}{{last.introFr|slice(0,170)|raw }}{% else %}{{last.introEn|slice(0,170)|raw }}{% endif %} </p>
  200.                                             </div>
  201.                                     </div>
  202.                                 </a>
  203.                             </div>
  207.                             <div class="col-lg-7 noBottom ">
  208.                                 <a data-aos="fade-up" data-aos-duration="1000" href="{{path('actualitesD',{'id':last.id, 'titre' : titreNew,'locale':app.request.locale})}}">
  209.                                     <img style="object-fit:cover;" id="imgAeronautique" class="w-100 h-100 img-fluid" src="
  211.                                             {% if last.image == 'ok' %}
  212.                                                 {{asset('uploads/actualites/cpi-actu-defaut.jpg')}}
  213.                                             {% else %}
  214.                                                 {{asset('uploads/actualites/'~last.image)}}
  215.                                             {% endif %}
  216.                                             " alt="salon aeronautique">
  217.                                 </a>
  218.                             </div>
  219.                         </div>
  220.                         {% endfor %}
  221.                         <div class="row twoActu" style="margin-top:30px;">
  222.                         {% for res in two %}
  223.                             {% if res.id not in lastsIds %}
  225.                             {% if res.afficher == 1 %}
  226.                             {% if app.request.locale == 'fr' %}
  227.                                 {% set titreNew = res.titreFr|replace({' ':'_',"'":"_"}) %}
  228.                             {% else %}
  229.                                 {% set titreNew = res.titreEn|replace({' ':'_',"'":"_"}) %}
  230.                             {% endif %}
  231.                                 <div data-aos="fade-up" data-aos-duration="1000" class="col-lg-6 noBottom ">
  232.                                     <div class="carte">
  233.                                         <a href="{{path('actualitesD',{'id':res.id, 'titre': titreNew,'locale':app.request.locale})}}">
  234.                                             <img style="object-fit:cover;"  class="img-fluid" src="
  236.                                                 {% if res.image == 'ok' %}
  237.                                                     {{asset('uploads/actualites/cpi-actu-defaut.jpg')}}
  238.                                                 {% else %}
  239.                                                     {{asset('uploads/actualites/'~res.image)}}
  240.                                                 {% endif %}
  241.                                                 " alt="salon aeronautique">
  242.                                             <div class="texte-carte pt-1 pt-md-2">
  243.                                             <div class="titre" >
  244.                                                     <p data-aos="fade-right" data-aos-duration="1000" style="min-height:80px">{% if app.request.locale == 'fr' %}{{res.titreFr|slice(0,90)}}{% else %}{{res.titreEn|slice(0,90)}}{% endif %} ...</p>
  245.                                                 </div>
  246.                                                 <div class="description "style="font-size: 21px!important;">
  247.                                                <p data-aos="fade-right" data-aos-duration="1000">{% if app.request.locale == 'fr' %}{{res.introFr|slice(0,170)|raw }}...{% else %}{{res.introEn|slice(0,170)|raw }}...{% endif %}</p>
  248.                                             </div>
  249.                                                
  250.                                                 <div data-aos="fade-right" data-aos-duration="1000" class="date" >
  251.                                                     <img src="{{asset('img/actualites/clock.png')}}" alt="clock">
  252.                                                     <p>
  253.                                                 {{res.date|date('d')}}
  255.                                                                 {% if app.request.locale == 'fr' %}
  256.                                                             {% if res.date|date('m') == '01' %}JANVIER{% endif %}
  257.                                                             {% if res.date|date('m') == '02' %}FEVRIER{% endif %}
  258.                                                             {% if res.date|date('m') == '03' %}MARS{% endif %}
  259.                                                             {% if res.date|date('m') == '04' %}AVRIL{% endif %}
  260.                                                             {% if res.date|date('m') == '05' %}MAI{% endif %}
  261.                                                             {% if res.date|date('m') == '06' %}JUIN{% endif %}
  262.                                                             {% if res.date|date('m') == '07' %}JUILLET{% endif %}
  263.                                                             {% if res.date|date('m') == '08' %}AOUT{% endif %}
  264.                                                             {% if res.date|date('m') == '09' %}SEPTEMBRE{% endif %}
  265.                                                             {% if res.date|date('m') == '10' %}OCTOBRE{% endif %}
  266.                                                             {% if res.date|date('m') == '11' %}NOVEMBRE{% endif %}
  267.                                                             {% if res.date|date('m') == '12' %}DECEMBRE{% endif %}
  268.                                                         {% else %}
  269.                                                             {% if res.date|date('m') == '01' %}JANUARY{% endif %}
  270.                                                             {% if res.date|date('m') == '02' %}FEBRUARY{% endif %}
  271.                                                             {% if res.date|date('m') == '03' %}MARCH{% endif %}
  272.                                                             {% if res.date|date('m') == '04' %}APRIL{% endif %}
  273.                                                             {% if res.date|date('m') == '05' %}MAY{% endif %}
  274.                                                             {% if res.date|date('m') == '06' %}JUNE{% endif %}
  275.                                                             {% if res.date|date('m') == '07' %}JULY{% endif %}
  276.                                                             {% if res.date|date('m') == '08' %}AUGUST{% endif %}
  277.                                                             {% if res.date|date('m') == '09' %}SEPTEMBER{% endif %}
  278.                                                             {% if res.date|date('m') == '10' %}OCTOBER{% endif %}
  279.                                                             {% if res.date|date('m') == '11' %}NOVEMBER{% endif %}
  280.                                                             {% if res.date|date('m') == '12' %}DECEMBER{% endif %}
  283.                                                         {% endif %}
  285.                                                                 {{res.date|date('Y')}}
  286.                                                 </p>
  287.                                                 </div>
  288.                                             </div>
  289.                                         </a>
  290.                                     </div>
  291.                                 </div>
  292.                                 {% else %}
  293.                                 {% endif %}
  294.                                     {% endif %}
  296.                             {% endfor %}
  297.                         </div>
  298.                         <div class="row" style="margin-top:30px;">
  299.                         {% for res in all %}
  300.                             {% if res.id not in lastsIds %}
  302.                         {% if res.afficher == 1 %}
  303.                             {% if app.request.locale == 'fr' %}
  304.                                 {% set titreNew = res.titreFr|replace({' ':'_'}) %}
  305.                             {% else %}
  306.                                 {% set titreNew = res.titreEn|replace({' ':'_'}) %}
  307.                             {% endif %}
  308.                             <div data-aos="fade-up" data-aos-duration="1000" class="col-xxl-4 col-sm-6 col-12" style="position: relative; padding-bottom : 30px;margin-top:42px;">
  309.                                 <div class="carte carteOther mt-5 mt-md-2">
  310.                                    <a href="{{path('actualitesD',{'id':res.id, 'titre': titreNew,'locale':app.request.locale})}}">
  311.                                         <div class="imgAnimee">
  312.                                             <img style="object-fit:cover;" class="img-fluid" src="
  314.                                             {% if res.image == 'ok' %}
  315.                                                 {{asset('uploads/actualites/cpi-actu-defaut.jpg')}}
  316.                                             {% else %}
  317.                                                 {{asset('uploads/actualites/'~res.image)}}
  318.                                             {% endif %}
  319.                                             "alt="salon aeronautique">
  321.                                             <div class="hover-effect  d-flex justify-content-center aligne-items-center" style="background-color : rgba(25,0,105,0.75);">
  322.                                                     <button type="button" class="btn btn-outline-light buttonMore hover-btn-actu" >{% if app.request.locale == 'fr' %}Lire l'article{% else %}Read the article{% endif %}</button>
  323.                                             </div>
  324.                                         </div>
  325.                                         <div class="texte-carte pt-1 pt-md-2">
  326.                                             <div class="titre">
  327.                                                  <p style="min-height:145px">{% if app.request.locale == 'fr' %}{{res.titreFr|slice(0,90)}}{% else %}{{res.titreEn|slice(0,90)}}{% endif %} ...</p>
  328.                                             </div>
  329.                                             <div class="description "style="font-size: 21px!important;">
  330.                                                <p data-aos="fade-right" data-aos-duration="1000">{% if app.request.locale == 'fr' %}{{res.introFr|slice(0,170)|raw }}...{% else %}{{res.introEn|slice(0,170)|raw }}...{% endif %}</p>
  331.                                             </div>
  332.                                            
  333.                                             <div class="date" style="position: absolute;">
  334.                                                 <img src="{{asset('img/actualites/clock.png')}}" alt="clock">
  335.                                                 <p>
  336.                                                 
  337.                                                 {{res.date|date('d')}}
  339.                                                         {% if app.request.locale == 'fr' %}
  340.                                                             {% if res.date|date('m') == '01' %}JANVIER{% endif %}
  341.                                                             {% if res.date|date('m') == '02' %}FEVRIER{% endif %}
  342.                                                             {% if res.date|date('m') == '03' %}MARS{% endif %}
  343.                                                             {% if res.date|date('m') == '04' %}AVRIL{% endif %}
  344.                                                             {% if res.date|date('m') == '05' %}MAI{% endif %}
  345.                                                             {% if res.date|date('m') == '06' %}JUIN{% endif %}
  346.                                                             {% if res.date|date('m') == '07' %}JUILLET{% endif %}
  347.                                                             {% if res.date|date('m') == '08' %}AOUT{% endif %}
  348.                                                             {% if res.date|date('m') == '09' %}SEPTEMBRE{% endif %}
  349.                                                             {% if res.date|date('m') == '10' %}OCTOBRE{% endif %}
  350.                                                             {% if res.date|date('m') == '11' %}NOVEMBRE{% endif %}
  351.                                                             {% if res.date|date('m') == '12' %}DECEMBRE{% endif %}
  352.                                                         {% else %}
  353.                                                             {% if res.date|date('m') == '01' %}JANUARY{% endif %}
  354.                                                             {% if res.date|date('m') == '02' %}FEBRUARY{% endif %}
  355.                                                             {% if res.date|date('m') == '03' %}MARCH{% endif %}
  356.                                                             {% if res.date|date('m') == '04' %}APRIL{% endif %}
  357.                                                             {% if res.date|date('m') == '05' %}MAY{% endif %}
  358.                                                             {% if res.date|date('m') == '06' %}JUNE{% endif %}
  359.                                                             {% if res.date|date('m') == '07' %}JULY{% endif %}
  360.                                                             {% if res.date|date('m') == '08' %}AUGUST{% endif %}
  361.                                                             {% if res.date|date('m') == '09' %}SEPTEMBER{% endif %}
  362.                                                             {% if res.date|date('m') == '10' %}OCTOBER{% endif %}
  363.                                                             {% if res.date|date('m') == '11' %}NOVEMBER{% endif %}
  364.                                                             {% if res.date|date('m') == '12' %}DECEMBER{% endif %}
  367.                                                         {% endif %}
  369.                                                             {{res.date|date('Y')}}</p>
  370.                                             </div>
  371.                                         </div>
  372.                                     </a>
  373.                                 </div>
  374.                             </div>
  375.                             {% else %}
  376.                                 {% endif %}
  377.                                     {% endif %}
  379.                             {% endfor %}
  380.                            
  382.                     </div>
  383.                 </div>
  384.             </div>
  385.         </div>
  386.          </section>
  387.     </main>
  388.    
  389.     
  390.     <!-- Assurez-vous d'ajuster les chemins vers les images selon la structure de votre projet et d'adapter le rendu HTML selon vos besoins. -->
  391.     
  392.     
  393.     
  396. {% endblock %}