templates/Default/base.html.twig line 1

Open in your IDE?
  1. {% set hasReCaptcha = true %}
  2. {% extends 'Default/parameters.html.twig' %}
  3. {% block html %}
  4. <!doctype html>
  5. <html lang='fr' class='{{desktop("adapt")}}'>
  6.     <head>
  7.         <title>{{t}}</title>
  8.         <meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
  9.         <meta name='description' content='{{d}}' />
  10.         <meta name='viewport' content='width=device-width, user-scalable=no, initial-scale=1' />
  11.         <meta property='fb:app_id' content='798097520521275' />
  12.         <meta property='og:url' content='{{app.request.uri}}' />
  13.         <meta property='og:type' content='article' />
  14.         <meta property='og:title' content='{{t}}' data-dynamic='true' />
  15.         <meta property='og:description' content='{{d}}' data-dynamic='true' />
  16.         <meta property='og:image' content='{{w}}{{thumb}}?v=001' data-dynamic='true' />
  17.         <meta property='og:image:width' content='{{thumbnailSize.width}}' data-dynamic='true'>
  18.         <meta property='og:image:height' content='{{thumbnailSize.height}}' data-dynamic='true'>
  19.         <meta property='og:locale' content='fr_FR' />
  20.         <meta property='og:site_name' content='{{sitename}}' />
  21.         <meta property='twitter:url' content='{{app.request.uri}}' />
  22.         <meta property='twitter:card' content='summary' />
  23.         <meta property='twitter:title' content='{{t}}' />
  24.         <meta property='twitter:description' content='{{d}}' />
  25.         <meta property='twitter:image' content='{{w}}{{thumb}}' />
  26.         <link rel="icon" href="{{asset('images/favicon.ico')}}?v=001">
  27.         <link type='text/css' rel='stylesheet' href='{{asset("css/os-style.css")}}?v=002' />
  28.         <link type='text/css' rel='stylesheet' href='{{asset("css/style.css")}}?v=004' />
  29.         <link type='text/css' rel='stylesheet' href='{{asset("css/os-anim.css")}}' />
  30.         <script src="https://kit.fontawesome.com/6451c614e6.js" crossorigin="anonymous"></script>
  31.         {% block css %}
  32.         {% endblock %}
  33.         {% if (hasReCaptcha ?? false) %}
  34.         <script src="https://www.google.com/recaptcha/api.js" async defer></script>
  35.         {% endif %}
  36.     </head>
  37.     <body class='bg-white'>
  38.         {% block container %}
  39.         <div id='container' class='container relative w100 hoverflow'>
  40.             <header id='header' class='bg-white shadow-header fixed left top w100 hheight transition-1s gpadding {{desktop("")}} {{mobile("")}}'>
  41.             {% block header %}
  42.                 <div class='relative top flex row space fill transition-1s {{desktop("")}}'>
  43.                     <div class='relative fill flex row space {{desktop("")}} {{mobile("")}}'>
  44.                         <a href='{{path("home")}}' class='transition white h100 relative {{desktop(" vt-10-in")}} {{mobile("vt-10-in")}}'>
  45.                             <img src="{{asset(os_param('logo'))}}" class='block h100'>
  46.                         </a>
  47.                         {% block menu %}
  48.                         <div class="flex row middle space h100 {{desktop('w100')}}">
  49.                             <menu id='menu' class='fill transition-alt {{desktop("h100")}} {{mobile("bg-success fixed top left htop w100")}}'>
  50.                                 {{render(controller('App\\Controller\\DefaultController::menu',{activeMenu:(menu is defined ? menu)}))}}
  51.                             </menu>
  52.                         </div>
  53.                         {% endblock %}
  54.                         <div class="flex row middle">
  55.                             <span class="os-click flex row middle {{desktop('hz-10-in')}}{{mobile(' hz-5-in')}}" data-target="#searchBox">
  56.                                 <i class="icon w100 search h100 filter-black {{desktop('min')}}{{mobile('')}}"></i>
  57.                             </span>
  58.                             {% if isDesktop() %}
  59.                             <div class='h5 black flex row vt-10  {{mobile("center")}}'>
  60.                                 {% set social = os_param('socialmedia') %}
  61.                                 {% set class = "icon min fab left-5" %}
  62.                                 {% if social.whatsapp %}<a href='{{social.whatsapp}}' class='{{class}} fa-whatsapp' target="_blank" title="Nous écrire sur WhatsApp"></a>{% endif %}
  63.                                 {% if social.facebook %}<a href='{{social.facebook}}' class='{{class}} fa-facebook-square' target="_blank" title="Page Facebook officiel"></a>{% endif %}
  64.                                 {% if social.twitter %}<a href='{{social.twitter}}' class='{{class}} fa-twitter' target="_blank" title="Compte Twitter officiel"></a>{% endif %}
  65.                                 {% if social.youtube %}<a href='{{social.youtube}}' class='{{class}} fa-youtube' target="_blank" title="Compte Youtube officiel"></a>{% endif %}
  66.                                 {% if social.linkedin %}<a href='{{social.linkedin}}' class='{{class}} fa-linkedin' target="_blank" title="Compte Flickr officiel"></a>{% endif %}
  67.                             </div>
  68.                             {% endif %}
  69.                             {% if isMobile() %}
  70.                             <div id='btn-menu' class='left-10 flex col middle os-click' data-target='#menu'>
  71.                                 <i class='fa fa-bars h1 black'></i>
  72.                             </div>
  73.                             {% endif %}
  74.                         </div>
  75.                     </div>
  76.                 </div>
  77.             {% endblock header %}
  78.             </header>
  79.             {% block banner %}
  80.             <div id='banner' class='banner bg-success relative w100 htop-in {{desktop("")}} {{mobile("")}}'>
  81.                 <div class='relative flex row space w100 gpadding {{desktop("hpadding")}} {{mobile("vt-30-in")}}'>
  82.                     {% if banner is defined %}
  83.                     <div class="absolute fill top left">
  84.                         <figure class="fill relative hoverflow">
  85.                             <img src="{{banner}}" class="cover">
  86.                         </figure>
  87.                     </div>
  88.                     <i class="absolute top left fill gradient-banner"></i>
  89.                     {% endif %}
  90.                     {% block titlebox %}
  91.                     <div class='relative white w100 flex col {{desktop("top-20-in")}} {{mobile("")}}'>
  92.                         {% block title %}
  93.                         <h1 class='special-alt extrabold left-30-in'>
  94.                             <span class="home-title">{{titleAlt is defined ? titleAlt|replace({" **":" <strong class='extrabold'>","'**":"'<strong class='extrabold'>","**":"</strong>"})|raw : title is defined ? title : "Aucune donnée"}}</span>
  95.                         </h1>
  96.                         {% endblock title %}
  97.                         {% if description is defined or subtitle is defined %}
  98.                         <p class="h5 medium left-30-in upper {{desktop('half_80')}}">
  99.                         {{description is defined ? description|nl2br : subtitle}}
  100.                         </p>
  101.                         {% endif %}
  102.                     </div>
  103.                     {% endblock %}
  104.                 </div>
  105.             </div>
  106.             {% endblock banner %}
  107.             {% block body %}
  108.             <div id='content' class='bg-white content relative'>
  109.                 {% block content %}
  110.                 {% endblock content %}
  111.             </div>
  112.             {% endblock body %}
  114.             {% if not home and noShare is not defined %}
  115.             <div class='flex col middle center  bg-warning sharing-box gpadding {{desktop('vt-40-in')}} {{mobile('vt-20-in')}}'>
  116.                 <h2 class='h6 black upper vt-8-in font-alt bold'>Partager cette page</h2>
  117.                 <div class='flex row middle black'>
  118.                     {% set link = app.request.uri %}
  119.                     {% if title is not defined %}{% set title = "Site web du "~sitename %} {% endif %}
  120.                     {% set class = "iflex col middle center "~ desktop(' h4 hz-10')~ mobile(' h1 hz-8') %}
  121.                     <a class='{{class}}' title='Partager via WhatsApp' target='_blank' href='whatsapp://send?text={{title}} => {{link}}'><i class='transition fab fa-whatsapp'></i></a>
  122.                     <a class='{{class}}' title='Partager sur Facebook' target='_blank' href='https://www.facebook.com/sharer/sharer.php?u={{link}}&t={{title}}'><i class='transition fab fa-facebook-square'></i></a>
  123.                     <a class='{{class}}' title='Partager sur Twitter' target='_blank' href='https://twitter.com/intent/tweet?text={{title}}&url={{link}}'><i class='transition fab fa-twitter'></i></a>
  124.                     <a class='{{class}}' title='Envoyer par mail' target='_blank' href='mailto:?subject={{title}}&amp;body=Je vous invite à lire cette page :  {{link}}.'><i class='transition fa fa-envelope'></i></a>
  125.                     <a class='{{class}}' title='Partager sur LinkedIn' target='_blank' href='https://www.linkedin.com/shareArticle?mini=true&url={{link}}&title={{title}}'><i class='transition fab fa-linkedin'></i></a>
  126.                 </div>
  127.             </div>
  128.             {% endif %}
  131.             <div class="relative bg-warning gpadding">
  132.                 <div class="bg-black vt-60-in absolute bottom left w100"></div>
  133.                 {{render(controller('App\\Controller\\Front\\SubscribersFrontController::form',{}))}}
  134.                 {% if isDesktop() %}
  135.                 <div class="gwidth absolute bottom right">
  136.                     <div class="w100 flex row center">
  137.                         <a href="#banner" class="os-scroll relative icon bg-white circle {{desktop('padding-15')}}">
  138.                             <span href="#banner" class="block relative fill">
  139.                                 <img src="{{asset('icons/arrow-up.png')}}" class="contain">
  140.                             </span>
  141.                         </a>
  142.                     </div>
  143.                 </div>
  144.                 {% endif %}
  145.             </div>
  147.             {% block footer %}
  148.             <footer id="footer" class="bg-black relative gpadding white flex {{desktop('col htop-in bottom-40-in')}} {{mobile('col vt-40-in')}}">
  150.                 <div class="flex center middle {{desktop('row')}}{{mobile('col')}}">
  151.                     <div class="{{desktop("")}}">
  152.                         <figure class="relative hoverflow {{desktop('hheight hz-40-in')}} {{mobile('hz-60-in vt-10-in w100')}}">
  153.                             <img src="{{asset('images/ministere.png')}}" class="{{desktop('h100')}}{{mobile('w100')}}">
  154.                         </figure>
  155.                     </div>
  156.                     <div class="{{desktop("")}}">
  157.                         <figure class="relative hoverflow {{desktop('hheight hz-40-in')}} {{mobile('hz-60-in vt-10-in w100')}}">
  158.                             <img src="{{asset(os_param('logo'))}}" class="filter-white {{desktop('h100')}}{{mobile('w100')}}">
  159.                         </figure>
  160.                     </div>
  161.                     <div class="{{desktop("")}}">
  162.                         <figure class="relative hoverflow {{desktop('hheight hz-40-in')}} {{mobile('hz-60-in vt-10-in w100')}}">
  163.                             <img src="{{asset('images/cooperation-alt.png')}}" class="{{desktop('h100')}}{{mobile('w100')}}">
  164.                         </figure>
  165.                     </div>
  166.                 </div>
  167.                 <div class="w100 relative flex {{desktop('row space top-80')}}{{mobile('col center text-center')}}">
  168.                     {% set class = "block "~desktop("top-10")~mobile("vt-3-in") %}
  169.                     <div class="{{desktop('right-60')}} {{mobile('top-20')}}">
  170.                         <span class="upper gray medium" href="">Navigation</span>
  171.                         <ul class="flex col p-alt {{desktop('left-20-in')}} {{mobile('list')}}">
  172.                             <li class=""><a class="{{class}}" href="{{path('formations')}}">Formations</a></li>
  173.                             <li class=""><a class="{{class}}" href="{{path('events')}}">Colloques</a></li>
  174.                             <li class=""><a class="{{class}}" href="{{path('professions')}}">Professions</a></li>
  175.                             <li class=""><a class="{{class}}" href="{{path('articles')}}">Actualités</a></li>
  176.                             <li class=""><a class="{{class}}" href="{{path('resources')}}">Ressources</a></li>
  177.                         </ul>
  178.                     </div>
  179.                     <div class="{{desktop('right-60')}} {{mobile('top-20')}}">
  180.                         <span class="upper gray medium" href="">Liens utiles</span>
  181.                         <ul class="flex col p-alt {{desktop('left-20-in')}} {{mobile('list')}}">
  182.                             <li class=""><a class="{{class}}" href="https://www.gouv.bj" target="_blank">Gouvernement du Bénin</a></li>
  183.                             <li class=""><a class="{{class}}" href="https://beninrevele.bj" target="_blank">Programme d'Actions du Gouvernement</a></li>
  184.                             <li class=""><a class="{{class}}" href="https://justice.gouv.bj" target="_blank">Ministère de la Justice et de la Législation</a></li>
  185.                             <li class=""><a class="{{class}}" href="https://sgg.gouv.bj" target="_blank">Secrétariat général du Gouvernement</a></li>
  186.                             <li class=""><a class="{{class}}" href="https://european-union.europa.eu/index_fr" target="_blank">Union Européenne</a></li>
  187.                         </ul>
  188.                     </div>
  189.                     <div class="flex col {{desktop('left right-60')}} {{mobile('top-20')}}">
  190.                         <span class="upper gray medium" href="">Nos contacts</span>
  192.                         <ul class='p-alt white flex row {{mobile("center")}}'>
  193.                             <li class='relative flex col top  {{mobile("center")}}'>
  194.                                 <span class='vt-5-in flex row middle'>
  195.                                     <i class='fa fa-envelope top-5 right-10'></i>
  196.                                     <span>{{os_param("contacts").email}}</span>
  197.                                 </span>
  198.                                 <span class='vt-5-in flex row middle'>
  199.                                     <i class='fa fa-phone top-5 right-10'></i>
  200.                                     <span>{{os_param("contacts").phone}}</span>
  201.                                 </span>
  202.                             </li>
  203.                         </ul>
  204.                         <div class="flex row middle top-10 {{mobile('center')}}">
  205.                             {% set class="icon circle bg-white flex col middle center right-10 "~desktop('min')~mobile('') %}
  206.                             {% set social = os_param('socialmedia') %}
  207.                             {% if social.whatsapp %}<a href='{{social.whatsapp}}' class='{{class}}' target="_blank" title="Nous écrire sur WhatsApp"><i class="success fab fa-whatsapp"></i></a>{% endif %}
  208.                             {% if social.facebook %}<a href='{{social.facebook}}' class='{{class}}' target="_blank" title="Page Facebook officiel"><i class="success fab fa-facebook-f"></i></a>{% endif %}
  209.                             {% if social.twitter %}<a href='{{social.twitter}}' class='{{class}}' target="_blank" title="Compte Twitter officiel"><i class="success fab fa-twitter"></i></a>{% endif %}
  210.                             {% if social.youtube %}<a href='{{social.youtube}}' class='{{class}}' target="_blank" title="Compte Youtube officiel"><i class="success fab fa-youtube"></i></a>{% endif %}
  211.                             {% if social.linkedin %}<a href='{{social.linkedin}}' class='{{class}}' target="_blank" title="Compte Flickr officiel"><i class="success fab fa-flickr"></i></a>{% endif %}
  212.                         </div>
  213.                     </div>
  214.                 </div>
  215.                 <div class="flex col center text-center warning {{desktop('top-80')}}{{mobile('top-20')}}">
  216.                     <span>© Copyright 2022 - EFPJ</span>
  217.                     <span class="p-alt white vt-10">Financé par l'Union Européenne</span>
  218.                     <a href="{{path('page',{slug:'mentions-legales'})}}" class="top-10 p-alt">Mentions légales et politique de confidentialité</a>
  219.                 </div>
  220.                 <div class="absolute left bottom w100 gpadding">
  221.                     <div class="w100 flag flex row flex-1">
  222.                         <i></i>
  223.                         <i></i>
  224.                         <i></i>
  225.                     </div>
  226.                 </div>
  227.             </footer>
  228.             {% endblock footer %}
  229.         </div>
  230.     {% endblock container %}
  233.         <div id='searchBox' class='anim-display anim-show vfill fixed top left'>
  234.             <i class="block mask fill absolute top left"></i>
  235.             <div class='hpadding fill flex row center middle'>
  236.                 <div class='bg-gray relative shadow  {{desktop("half_80 vt-80-in hz-80-in")}} {{mobile("vt-20-in hz-20-in")}}'>
  237.                     <div class='absolute top right bg-error padding-10'>
  238.                         <span data-target='#searchBox' class='block icon close contain filter-white os-click'></span>
  239.                     </div>
  240.                     <div class='w100 flex col around'>
  241.                         <div class='flex col middle top-20 text-center'>
  242.                             <h2 class='h3 success'>Faire une recherche</h2>
  243.                             <p class='h6 top-10 bottom-20'>Formations, professions, colloques, articles, documents, etc.</p>
  244.                             <div class='flex row hoverflow text-center {{desktop("")}}{{mobile("")}}'>
  245.                                 <div class='bg-gray w100'>
  246.                                     <input id='searchInput' data-action='{{path("search",{keywords:":keywords"})}}' type='search' class='os-search block noborder bg-white h4 black {{desktop("hz-40-in vt-20-in")}} {{mobile("hz-20-in vt-10-in")}} block w100' placeholder='Saisissez votre recherche ici'>
  247.                                 </div>
  248.                                 <div class='relative flex col middle center {{desktop("vt-10-in ")}} {{mobile("vt-8-in")}} hz-20-in bg-success'>
  249.                                     <span class='block icon small search contain filter-white os-search-btn pointer' data-target='#searchInput'></span>
  250.                                 </div>
  251.                             </div>
  252.                         </div>
  253.                     </div>
  254.                 </div>
  255.             </div>
  256.         </div>
  258.     {% set notices = app.session.flashBag.get('notice') %}
  259.     {% if notices|length %}
  260.         <div class='popup show gpadding flex col middle center'>
  261.             <span class='icon contain close os-close filter-white absolute top right'></span>
  262.             {% for notice in notices %}
  263.             <div class='flex row middle center relative bg-white hz-40-in vt-20-in '>
  264.                 <div class='flex row  success text-left'>
  265.                     <i class='fa fa-thumbs-up fa-3x top-5  right-20'></i>
  266.                     <p class='h4  black'>{{notice|raw}}</p>
  267.                 </div>
  268.             </div>
  269.             {% endfor %}
  270.         </div>
  271.     {% endif %}
  273.         {% if os_param('GA') and app.request.schemeAndHttpHost() != 'http://localhost' %}
  274.         {% set code = os_param('GA') %}
  275.         <!-- Global site tag (gtag.js) - Google Analytics -->
  276.         <script async src="https://www.googletagmanager.com/gtag/js?id={{code}}"></script>
  277.         <script>
  278.           window.dataLayer = window.dataLayer || [];
  279.           function gtag(){dataLayer.push(arguments);}
  280.           gtag('js', new Date());
  281.           gtag('config', '{{code}}');
  282.         </script>
  283.         {% endif %}
  284.         <script src='{{asset("js/jquery-3.6.0.min.js")}}'></script>
  285.         <script src='{{asset("js/os-script.js")}}?v=004'></script>
  286.         <script src='{{asset("js/script.js")}}?v=004'></script>
  287.         {% block js %}
  288.         {% endblock %}
  289.         {% block script %}
  290.         {% endblock %}
  291.     </body>
  292. </html>
  293. {% endblock %}