templates/Nordinfo/Main/detail_organisation.html.twig line 1

Open in your IDE?
  1. {% extends 'Nordinfo/Main/base.html.twig' %}
  2. {% set show_btt = true %}
  3. {% block title %}{{ organisation.title }} - Nord Info{% endblock %}
  4. {% block header_epingles %}
  5.   {{ include('Lenord/Main/parts/epingles.html.twig') }}
  6. {% endblock %}
  7. {% block header_breadcrumb %}
  8.   {{ include('Nordinfo/Main/parts/breadcrumb.html.twig') }}
  9. {% endblock %}
  10. {% block body %}
  11.     <main role="main" class="mainContent pt-0 pb-0" data-form-validation-step="hidden" id="mainContent" tabindex="-1" {% if related_posts|length > 0 %}style="position:relative;"{% endif %}>
  12.     {% include 'Nordinfo/Main/parts/back_btn.html.twig' with {'back_btn_class':'_list-page'} %}
  13.     <div class="container pt-5">
  14.       <div class="containerPageHeader">
  15.         <h1>Organisation</h1>
  16.       </div>
  17.     </div>
  18.         <hr class="hrBrown mb-0 mt-0">
  19.         <div class="accordion accordionContactDetails" id="accordionContactDetails">
  20.             <div class="card">
  21.                 <a href="#" class="card-header collapsed" data-focus-content-target="verify" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
  22.                     <div class="container">
  23.                         <div class="__inner">
  24.                             <div class="__col-img">
  25.                                 <div class="__img" style="background-image:url('{{ asset('img/icons/organisation-generique.png') }}')"></div>
  26.                             </div>
  27.                             <div class="__col-info">
  28.                                 <div class="__title" id="headingOne">{{ organisation.title }}</div>
  29.                                 <div class="__subtitle">{{ organisation.subtitle }}</div>
  30.                             </div>
  31.                             <div class="__col-arrow">
  32.                                 <svg aria-hidden="true" focusable="false" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 283.5 283.5">
  33.                                     <g id="Chevron_horizontal" data-name="Bouton retour">
  34.                                         <path id="Chevron" d="M7.09,190.21l125.1-126.6a13.4,13.4,0,0,1,18.9-.2l.2.2,125.1,126.6a19.92,19.92,0,0,1,0,27.9,19.4,19.4,0,0,1-27.4.2l-.2-.2-107-108.3-107,108.3a19.4,19.4,0,0,1-27.4.2l-.2-.2a19.83,19.83,0,0,1-.1-27.9"/>
  35.                                     </g>
  36.                                 </svg>
  37.                             </div>
  38.                         </div>
  39.                     </div>
  40.                 </a>
  41.                 <div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordionContactDetails">
  42.                     <div class="card-body">
  43.                         <div class="container pt-3">
  44.                             {% if organisation.shortDescription|length > 0 %}
  45.                                 <p class="font-weight-bold mb-3">{{ organisation.shortDescription }}</p>
  46.                             {% endif %}
  47.                             <ul class="lsNone">
  48.                                 <li>
  49.                                     <a href="https://www.google.com/maps/search/?api=1&query={{ organisation.rue }}" target="_blank" class="cardInfo _map">
  50.                                         <div class="__col-img">
  51.                                             <div class="__img">
  52.                                                 {% if organisation.latitude|length == 0 or organisation.longitude|length == 0 %}
  53.                                                     <iframe allowfullscreen="allowfullscreen" height="100%" src="https://www.google.com/maps?q={{ organisation.rue }}, {{ organisation.codePostal }} {{ organisation.ville }}&z=12&amp;output=embed" style="border:0" width="100%"></iframe>
  54.                                                 {% else %}
  55.                                                     <iframe allowfullscreen="allowfullscreen" height="100%" src="https://www.google.com/maps?q={{ organisation.longitude }},{{ organisation.latitude }}&z=12&amp;output=embed" style="border:0" width="100%"></iframe>
  56.                                                 {% endif %}
  57.                                             </div>
  58.                                         </div>
  59.                                         <div class="__col-info">
  60.                                             <div class="__title">
  61.                                                 <span>{{ organisation.rue }},<br>{{ organisation.codePostal }}<br>{{ organisation.ville }}</span>
  62.                                             </div>
  63.                                         </div>
  64.                                     </a>
  65.                                 </li>
  66.                                 {% if organisation.link1 is not null %}
  67.                                     <li>
  68.                                         <a href="{{ organisation.link1 }}" target="_blank" class="cardResource _external">
  69.                                             <div class="__col-icon">
  70.                                                 <svg aria-hidden="true" focusable="false" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 283.5 283.5">
  71.                                                     <path class="cls-1" d="M172.1,104.5a15.74,15.74,0,0,0-12.4-5.9,16,16,0,0,0-12.3,26.2,14.31,14.31,0,0,0,1.1,1.5l8.3,8.2a46.35,46.35,0,0,1,0,65.6l-36.6,36.6a46.41,46.41,0,0,1-65.6,0l-7.8-7.8a46.41,46.41,0,0,1,0-65.6l21.5-21.5a5.72,5.72,0,0,0,.7-.8,16,16,0,0,0-11.8-26.8,15.71,15.71,0,0,0-11.5,5L24.2,140.7a78.34,78.34,0,0,0,.1,110.6l7.8,7.8a78.46,78.46,0,0,0,110.8,0l36.6-36.6a78.46,78.46,0,0,0,0-110.8Z"/>
  72.                                                     <path d="M259.1,32.1l-7.8-7.8a78.46,78.46,0,0,0-110.8,0L103.9,60.9a78.34,78.34,0,0,0,0,110.8l7.7,7.7.6.6a7.17,7.17,0,0,0,1.5,1.1,15.76,15.76,0,0,0,9.5,3.2,16,16,0,0,0,10-28.5l-6.7-6.7a46.41,46.41,0,0,1,0-65.6l36.6-36.6a46.35,46.35,0,0,1,65.6,0l7.8,7.8a46.35,46.35,0,0,1,0,65.6l-21.4,21.4a15.73,15.73,0,0,0-4.9,11.5,16,16,0,0,0,26.1,12.4,3.92,3.92,0,0,0,1-.8l21.9-21.9A78.43,78.43,0,0,0,259.1,32.1Z"/>
  73.                                                 </svg>
  74.                         <span class="sr-only">lien</span>
  75.                                             </div>
  76.                                             <div class="__col-info">
  77.                                                 <div class="__title">
  78.                                                     <span>{{ organisation.link1 }}</span>
  79.                                                 </div>
  80.                                             </div>
  81.                                         </a>
  82.                                     </li>
  83.                                 {% endif %}
  84.                                 {% if organisation.link2 is not null %}
  85.                                     <li>
  86.                                         <a href="{{ organisation.link2 }}" target="_blank" class="cardResource _external">
  87.                                             <div class="__col-icon">
  88.                                                 <svg aria-hidden="true" focusable="false" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 283.5 283.5">
  89.                                                     <path class="cls-1" d="M172.1,104.5a15.74,15.74,0,0,0-12.4-5.9,16,16,0,0,0-12.3,26.2,14.31,14.31,0,0,0,1.1,1.5l8.3,8.2a46.35,46.35,0,0,1,0,65.6l-36.6,36.6a46.41,46.41,0,0,1-65.6,0l-7.8-7.8a46.41,46.41,0,0,1,0-65.6l21.5-21.5a5.72,5.72,0,0,0,.7-.8,16,16,0,0,0-11.8-26.8,15.71,15.71,0,0,0-11.5,5L24.2,140.7a78.34,78.34,0,0,0,.1,110.6l7.8,7.8a78.46,78.46,0,0,0,110.8,0l36.6-36.6a78.46,78.46,0,0,0,0-110.8Z"/>
  90.                                                     <path d="M259.1,32.1l-7.8-7.8a78.46,78.46,0,0,0-110.8,0L103.9,60.9a78.34,78.34,0,0,0,0,110.8l7.7,7.7.6.6a7.17,7.17,0,0,0,1.5,1.1,15.76,15.76,0,0,0,9.5,3.2,16,16,0,0,0,10-28.5l-6.7-6.7a46.41,46.41,0,0,1,0-65.6l36.6-36.6a46.35,46.35,0,0,1,65.6,0l7.8,7.8a46.35,46.35,0,0,1,0,65.6l-21.4,21.4a15.73,15.73,0,0,0-4.9,11.5,16,16,0,0,0,26.1,12.4,3.92,3.92,0,0,0,1-.8l21.9-21.9A78.43,78.43,0,0,0,259.1,32.1Z"/>
  91.                                                 </svg>
  92.                         <span class="sr-only">lien</span>
  93.                                             </div>
  94.                                             <div class="__col-info">
  95.                                                 <div class="__title">
  96.                                                     <span>{{ organisation.link2 }}</span>
  97.                                                 </div>
  98.                                             </div>
  99.                                         </a>
  100.                                     </li>
  101.                                 {% endif %}
  102.                             </ul>
  103.               {% if related_posts|length > 0 %}
  104.                 {% include 'Nordinfo/Main/parts/related_posts.html.twig' with {related_posts: related_posts} only %}
  105.               {% endif %}
  106.                         </div>
  107.                     </div>
  108.                     <hr class="hrBrown m-0">
  109.                 </div>
  110.             </div>
  111.         </div>
  112.         <div class="bgColorGrey pBXL">
  113.             {% if organisation.phone is not null or organisation.acceo is not null %}
  114.                 <div class="container text-center pb-4">
  115.                     {% if organisation.phone is not null %}
  116.                         <a href="tel:+33{{ organisation.phone|slice(1)|spaceless }}" class="btn btn-lg btnContactAction _green _call mt-4">
  117.                             <div class="__inner">
  118.                                 <div class="__col-icon">
  119.                                     <svg aria-hidden="true" focusable="false" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 94.02 94.02">
  120.                                         <path id="Tracé_103" data-name="Tracé 103" d="M68.72,90.31a38.72,38.72,0,0,1-14.85-3.89C33.08,76.6,16.86,62.2,7.72,40.5A99.2,99.2,0,0,1,3.84,26.33,16.17,16.17,0,0,1,7.26,13.08,30,30,0,0,1,17.77,4.4a9.15,9.15,0,0,1,3.43-.68,3.12,3.12,0,0,1,2.51,1.37c3.66,5.71,7.09,11.65,10.74,17.59A3,3,0,0,1,34,27L27.83,32.5c-4.57,3.89-5,5.26-1.83,10.06a47.57,47.57,0,0,0,7.77,10,237.23,237.23,0,0,0,18.5,15.31c4.8,3.65,5.72,3.19,9.37-1.37,1.37-1.6,2.51-3.43,4.11-5C68,59,69.41,58.78,72.38,60.38c5.48,3.2,10.74,6.39,16.22,9.36a2.86,2.86,0,0,1,1.6,3.89A21.5,21.5,0,0,1,74.89,89.16,57.65,57.65,0,0,1,68.72,90.31Z"/>
  121.                                     </svg>
  122.                                     <span class="sr-only">téléphone</span>
  123.                                 </div>
  124.                                 <div class="__col-text">
  125.                                     <span>{{ organisation.phone }}</span>
  126.                                 </div>
  127.                             </div>
  128.                         </a>
  129.                     {% endif %}
  130.                     {% if organisation.acceo is not null %}
  131.                         <a href="{{ organisation.acceo }}" class="btn btn-lg btnContactAction _eastern-blue _deaf mt-4">
  132.                             <div class="__inner">
  133.                                 <div class="__col-icon">
  134.                                     <svg aria-hidden="true" focusable="false" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 51.84 51.84">
  135.                                         <defs>
  136.                                             <style>
  137.                                                 .cls-1 {
  138.                                                     fill: #ec671c;
  139.                                                 }
  140.                                             </style>
  141.                                         </defs>
  142.                                         <path id="Tracé_78" data-name="Tracé 78" class="cls-1" d="M24.27,18.27a5.44,5.44,0,0,0-4,1.7,5.61,5.61,0,0,0-1.7,4,5.76,5.76,0,0,0,1.6,4l4,4,4.1-4.1a5.61,5.61,0,0,0,1.7-4,5,5,0,0,0-1.6-4A6.4,6.4,0,0,0,24.27,18.27Zm2.3,8a3.39,3.39,0,1,1,0-4.8h0a3.27,3.27,0,0,1,0,4.8Z"/>
  143.                                         <g id="Groupe_61" data-name="Groupe 61">
  144.                                             <g id="Groupe_60" data-name="Groupe 60">
  145.                                                 <path id="Tracé_79" data-name="Tracé 79" d="M24.49,49.17a12.35,12.35,0,0,1-11.2-6.5,4.25,4.25,0,1,1,7.4-4.2h0a4,4,0,0,0,4.3,2.2,4.67,4.67,0,0,0,3.2-2.6,7.77,7.77,0,0,0,.2-1.6,16.9,16.9,0,0,1,1.3-6.3,19.83,19.83,0,0,1,2.7-4.7,15.72,15.72,0,0,0,1.8-3.1,9.11,9.11,0,0,0-.9-7.2,8.19,8.19,0,0,0-7.4-4.2h-.4a8.82,8.82,0,0,0-6.5,3.3,13.84,13.84,0,0,0-1.8,3.9,4.28,4.28,0,0,1-4.2,3.4,2.77,2.77,0,0,1-.9-.1,4.32,4.32,0,0,1-3.3-5.1,19.12,19.12,0,0,1,3.5-7.5,17.15,17.15,0,0,1,13.1-6.4h.8a16.62,16.62,0,0,1,14.2,8.1l.1.1a17.19,17.19,0,0,1,2.1,13.6v.1a17.62,17.62,0,0,1-3.1,6.1,14.92,14.92,0,0,0-1.8,3l-.1.3a9.6,9.6,0,0,0-.6,3.3,13.19,13.19,0,0,1-.9,4.8,13,13,0,0,1-10.3,7.5A3.18,3.18,0,0,0,24.49,49.17Zm-7.4-10.3a1.88,1.88,0,0,0-.8.2,2,2,0,0,0-.8,1,1.28,1.28,0,0,0,.2,1.2,9.61,9.61,0,0,0,8.9,5.2h1a10.33,10.33,0,0,0,8.1-6,9.86,9.86,0,0,0,.7-3.8,12.6,12.6,0,0,1,.8-4.3l.1-.1a12.54,12.54,0,0,1,2.1-3.5,16.68,16.68,0,0,0,2.7-5.1h0a14.35,14.35,0,0,0-1.7-11.6h0a13.64,13.64,0,0,0-12.1-6.8h-.7a14.66,14.66,0,0,0-11,5.4,16.89,16.89,0,0,0-2.9,6.4,1.61,1.61,0,0,0,1.2,1.9h.3a1.6,1.6,0,0,0,1.6-1.3,13.4,13.4,0,0,1,2.3-5,11.13,11.13,0,0,1,9.1-4.2,10.9,10.9,0,0,1,9.6,5.4h0a11.43,11.43,0,0,1,1.3,9.2h0a12,12,0,0,1-2.2,4,17.55,17.55,0,0,0-2.4,4.2v.1a14.08,14.08,0,0,0-1.1,5.4,7.83,7.83,0,0,1-.4,2.6,7.15,7.15,0,0,1-5.4,4.1h-.8a6.48,6.48,0,0,1-6-3.5C18.19,39.27,17.69,38.87,17.09,38.87Z"/>
  146.                                             </g>
  147.                                         </g>
  148.                                     </svg>
  149.                                 </div>
  150.                                 <div class="__col-text">Sourd ou malentendant ?</div>
  151.                             </div>
  152.                         </a>
  153.                     {% endif %}
  154.                 </div>
  155.                 <hr class="hrBrown m-0">
  156.             {% endif %}
  157.             {% if organisation.email is not null %}
  158.                 <div class="container pt-4">
  159.                     <h2 class="text-center mb-3 d-validation-none" data-focus-content-target="initial">Votre message</h2>
  160.                     <h2 class="text-center mb-3 d-none d-validation-block">Vérifier votre message</h2>
  161.                     <p class="text-center d-validation-none">Les champs suivis d'un astérisque (<span class="colorRed">*</span>) sont obligatoires</p>
  162.                     <form action="{{ path('send_form') }}" method="post" enctype="multipart/form-data" class="needs-validation formCustom" novalidate>
  163.                         <input type="hidden" name="dest_nom" value="{{ organisation.title }}">
  164.                         <input type="hidden" name="raison">
  165.                         <input type="hidden" name="dest" value="automate.nordinfo@lenord.fr">
  166.                         <div class="form-validation-overlay mb-5">
  167.                             <div class="form-group">
  168.                                 <div class="__input-wrapper">
  169.                                     <div class="__inner">
  170.                                         <label for="validationCustom01">Adresse courriel (ex : nom@domaine.fr)
  171.                                             <span class="colorRed d-validation-none">*</span>
  172.                                         </label>
  173.                                         <input type="email" autocomplete="email" class="form-control" name="email" id="validationCustom01" placeholder="" required>
  174.                                     </div>
  175.                                 </div>
  176.                             </div>
  177.                             <div class="form-group">
  178.                                 <div class="__input-wrapper">
  179.                                     <div class="__inner">
  180.                                         <label for="validationCustom02">Objet
  181.                                             <span class="colorRed d-validation-none">*</span>
  182.                                         </label>
  183.                                         <input type="text" name="objet" class="form-control" id="validationCustom02" placeholder="" required>
  184.                                     </div>
  185.                                 </div>
  186.                             </div>
  187.                             <div class="form-group">
  188.                                 <div class="__input-wrapper _textarea">
  189.                                     <div class="__inner">
  190.                                         <label for="validationCustom03">Votre Message
  191.                                             <span class="colorRed d-validation-none">*</span>
  192.                                             :</label>
  193.                                         <textarea class="form-control" name="message" id="validationCustom03" placeholder="" rows="3" required></textarea>
  194.                                     </div>
  195.                                 </div>
  196.                             </div>
  197.                             <div class="form-group" data-form-validation-step-file-wrapper>
  198.                                 <div class="inputFileWrapper">
  199.                                     <input type="file" name="file" id="file-1" class="inputfile inputfile-1" accept="image/jpeg,image/gif,image/png,.pdf,.doc,.odt"/>
  200.                                     <label for="file-1" class="label-file">
  201.                                         <svg aria-hidden="true" focusable="false" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 283.5 283.5">
  202.                                             <path d="M261.5,124.6c-5.7-3.5-12.2-2.5-17.4,2.7-37.4,37.4-74.8,75-112.4,112.3-15.1,15-33.5,19.4-53.8,12.9C41.8,240.8,30.2,195,56.2,167.4c6.8-7.2,13.8-14,20.8-20.9h0l1.2-1.2,48-48,44.4-44.4c4.9-4.9,9.7-9.8,14.6-14.6,7.8-7.7,17.2-11.1,28-9.4,12.9,2,22,9.3,26.2,21.7,4.3,12.6,1.5,24-7.6,33.6-5.1,5.4-10.5,10.6-15.8,15.9L168.1,148c-9.2,9.2-18.4,18.5-27.7,27.6l-5.3,5.4c-1.4,1.3-2.6,2.8-4,4-2.8,2.5-5.3,5.3-8,7.9-1.5,1.4-3.1,2.6-4.6,3.9-7.7,4.1-14.1-1.3-14.5-1.7-5.6-5.4-5.7-13.3-.3-18.8l84-84c4.2-4.2,8.5-8.3,12.5-12.7,5.1-5.8,3.7-15-2.7-19.4-5.7-3.9-12.6-3.1-17.8,2.1L144.5,97.5c-19.9,19.9-39.9,39.8-59.8,59.8C75,167,71.3,178.6,73.3,192c2.7,18.7,19.6,33.3,38.6,33.3a39.87,39.87,0,0,0,29.3-12.2L250.5,103.8a59.56,59.56,0,0,0,15.7-27,58.78,58.78,0,0,0,1.9-18.2V57.5a48.59,48.59,0,0,0-.7-5.5C262.8,28,249,11.7,225.7,4.5c-21-6.5-40.4-2.1-56.8,12.6-10.2,9.1-19.5,19.2-29.2,28.9Q89.6,95.95,39.6,146c-15.1,15-23.5,33.1-24.1,54.4-.7,25.5,8.8,46.9,28.3,63.3,17.2,14.6,37.4,20.4,59.8,18a76.42,76.42,0,0,0,46.2-21.8c11.9-11.7,23.6-23.5,35.4-35.3,12.8-12.7,25.5-25.5,38.2-38.2l39.9-39.9a19.61,19.61,0,0,0,3.6-5.4C269.5,135.1,266.8,127.9,261.5,124.6Z"/>
  203.                                         </svg>
  204.                                         <span>
  205.                                             <span class="__underline">Ajouter une pièce jointe</span><br>
  206.                                             <span class="fsXs">5 Mo maximum. JPEG, GIF, PNG, PDF, DOC, ODT</span>
  207.                                         </span>
  208.                                     </label>
  209.                                 </div>
  210.                                 <script>
  211.                                     'use strict';;
  212. (function (document, window, index) {
  213. var inputs = document.querySelectorAll('.inputfile');
  214. Array.prototype.forEach.call(inputs, function (input) {
  215. var label = input.nextElementSibling,
  216. labelVal = label.innerHTML;
  217. input.addEventListener('change', function (e) {
  218. var fileName = '';
  219. if (this.files && this.files.length > 1) 
  220. fileName = (this.getAttribute('data-multiple-caption') || '').replace('{count}', this.files.length);
  221.  else 
  222. fileName = e.target.value.split('\\').pop();
  225. if (fileName) 
  226. label.querySelector('span').innerHTML = fileName;
  227.  else 
  228. label.innerHTML = labelVal;
  230. });
  231. // Firefox bug fix
  232. input.addEventListener('focus', function () {
  233. input.classList.add('has-focus');
  234. });
  235. input.addEventListener('blur', function () {
  236. input.classList.remove('has-focus');
  237. });
  238. });
  239. }(document, window, 0));
  240.                                 </script>
  241.                             </div>
  242.                             <div class="form-group">
  243.                                 <div class="form-check">
  244.                                     <input class="form-check-input" type="checkbox" value="" id="invalidCheck" name="checkbox" required>
  245.                                     <label class="form-check-label" for="invalidCheck">
  246.                                         En cochant cette case, j'accepte les
  247.                                         <a href="{{ path('post_detail', {slug: 'cgu'}) }}">Conditions Générales d'Utilisation</a>&nbsp;<span class="colorRed d-validation-none">*</span>
  248.                                     </label>
  249.                                     <p class="invalid-feedback" id="invalidFeedback">
  250.                                         Ce champs est obligatoire
  251.                                     </p>
  252.                                 </div>
  253.                             </div>
  254.                         </div>
  255.                         <div class="form-group d-none d-validation-block">
  256.                             <input type="hidden" name="nb1" value="{{ caps['valeur1']['valeur'] }}">
  257.                             <input type="hidden" name="nb2" value="{{ caps['valeur2']['valeur'] }}">
  258.                             <div class="__input-wrapper _captcha">
  259.                                 <div class="__inner">
  260.                                     <label for="inputCaptcha">Répondez à cette question de vérification avant d’envoyer votre évènement :
  261.                                                             Quel est le résultat de ({{ caps['valeur1']['libelle'] }}
  262.                                         +
  263.                                         {{ caps['valeur2']['libelle'] }})
  264.                                         <span class="colorRed d-validation-none">*</span>
  265.                                     </label>
  266.                                     <input class="form-control _captcha" id="inputCaptcha" type="text" name="captcha" data-focus-content-target="verify">
  267.                                 </div>
  268.                             </div>
  269.                         </div>
  270.                         <div class="__buttons-wrapper">
  271.                             <button class="btn btnFormSubmit d-none d-validation-inline-block _modify" data-form-validation-step-toggle>
  272.                                 <span>MODIFIER</span>
  273.                             </button>
  274.                             <button class="btn btnFormSubmit d-none d-validation-inline-block" type="submit">
  275.                                 <span>ENVOYER</span>
  276.                             </button>
  277.                             <button class="btn btnFormSubmit d-validation-none _validation" data-form-validation-step-toggle>
  278.                                 <span>VALIDER</span>
  279.                             </button>
  280.                         </div>
  281.                     </form>
  282.                 </div>
  283.             {% endif %}
  284.         </div>
  285.     {% if related_posts|length > 0 %}
  286.       <div class="gradientRelatedPosts"></div>
  287.     {% endif %}
  288.     </main>
  289. {% endblock %}