templates/home/contacts.html.twig line 1

  1. {% extends 'base.html.twig' %}
  3. {% block title %}Contacts{% endblock %}
  5. {% block stylesheets %}
  6.     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous" />
  7.     <style>
  9.     h1 {
  10.         font-size: 46px;
  11.         font-weight: bold;
  12.     }
  14.     .contacts  {
  15.         display:grid;
  16.         grid-template-columns: 5fr 3fr;
  17.     }
  19.     
  20.     .contacts h2 {
  21.         color: var(--titrelightcolor);
  22.         text-align: left;
  23.         margin: 50px 0 30px 0;
  24.         font-size: 26px;
  25.         font-weight: bold;
  26.     }
  28.     .contacts h3 {
  29.         font-size: 18px;
  30.         font-weight: bold;
  31.         text-align: left;
  32.         margin: 20px 0 10px 0;
  33.         font-family: 'Fenomen Sans';
  34.     }
  36.     
  38.     .icones {
  39.         margin: 0 0 0 auto;
  40.         padding-left:20px;
  41.     }
  43.     .contacts .grid  {
  44.         display:grid;
  45.         grid-template-columns: auto 1fr;
  46.         margin-bottom: 30px;
  47.         
  48.     }
  50.     .icone {
  51.         margin-right: 20px;
  52.     }
  54.     .contacts .grid .cell2 {
  55.         max-width: 240px;
  56.     }
  58.     .contacts a {
  59.         color: var(--lknaboutcolor) !important;
  60.     }
  62.     .contacts ul {
  63.         margin: 0;
  64.         padding: 0;
  65.         list-style: none;
  66.     }
  68.     .contacts li {
  69.         margin: 3px 0 5px 0;
  70.         font-size: 14px;
  71.     }
  73.     .contacts li i {
  74.         color: var(--lodeaocolor);
  75.         margin-right: 5px;
  76.         font-size: 12px;
  77.     }
  80.     @media screen and (max-width: 992px) {
  81.         .contacts { grid-template-columns: 1fr;  }
  82.         .icones { margin: 0 0 0 0; padding-left: 0; }
  83.         .contacts .grid .cell2 { max-width: 100%; }
  84.     }
  86.     </style>
  87.      <script src="https://www.google.com/recaptcha/api.js" async defer></script>
  88. {% endblock %}
  90. {% block body %}
  92.     <div class="breadcrumb"><div class="container">
  93.         <a href="{{ path('home_page') }}">Accueil</a> / Contacts</div>
  94.     </div>
  96.     <h1>Contacts</h1> 
  98.     <div class="container contacts">
  99.         
  100.         <div>
  101.             <h2>{{ contactmessage.nom }}</h2>
  102.             <p>{{ contactmessage.description|raw }}</p>  
  103.             {{ form_start(form) }}
  104.                 {{ form_widget(form) }}
  105.                 <div class="g-recaptcha margin-top-10" data-sitekey="6LcfSJwmAAAAAEVbB-U5_HYTJJj2rUSYBtzpf-K2"></div>
  106.                 <button class="btn-send">{{ button_label|default('ENVOYER') }}</button>
  107.             {{ form_end(form) }}
  108.             {% if msgretour != '' %}
  109.             <div style="font-size:18px; font-weight:bold; text-align:center; color:#759458; margin-top:10px;">{{ msgretour }}</div>
  110.             {% endif %}
  111.             <br/><br/><br/>
  112.         </div>
  113.         
  114.         <div class="icones">
  115.             <div class="grid">
  116.                 <img class="icone" src="{{ asset('assets/img/icon-contacts-1.png') }}" />
  117.                 <div class="cell2">
  118.                     <h3>LIENS UTILES</h3>
  119.                     <ul>
  120.                     {% for contact in liens %}
  121.                     <li><i class="fas fa-chevron-right"></i> <a href="{{ contact.adresse }}" target="_blank"><b>{{ contact.nom }}</b></a>&nbsp;: {{ contact.description }}</li>
  122.                     {% endfor %}
  123.                     </ul>
  124.                 </div>
  125.             </div>
  127.             <div class="grid">
  128.                 <img class="icone" src="{{ asset('assets/img/icon-contacts-3.png') }}" />
  129.                 <div class="cell2">
  130.                     <h3>ADMINISTRATEURS</h3>
  131.                     <ul>
  132.                     {% for contact in admins %}
  133.                         <li>
  134.                             <i class="fas fa-chevron-right"></i><b>{{ contact.nom }}</b>, {{ contact.description }}<br/>
  135.                             &nbsp;&nbsp;&nbsp;<a href="mailto:{{ contact.adresse }}" target="_blank">{{ contact.adresse }}</a>
  136.                         </li>
  137.                     {% endfor %}
  138.                     </ul>
  139.                 </div>
  140.             </div>
  141.              <br/><br/><br/>
  142.         </div>
  144.     </div>
  146. {% endblock %}