templates/contact.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %} {{ 'contact'|trans}} {% endblock %}
  5. {% block css %}
  6.     <style>
  7.         .contact .info-wrap {
  8.             box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  9.             padding: 30px;
  10.         }
  12.         .contact .info {
  13.             background: #fff;
  14.         }
  16.         .contact .info i {
  17.             font-size: 20px;
  18.             color: #0084d6;
  19.             float: left;
  20.             width: 44px;
  21.             height: 44px;
  22.             border: 1px solid #0084d6;
  23.             display: flex;
  24.             justify-content: center;
  25.             align-items: center;
  26.             border-radius: 50px;
  27.             transition: all 0.3s;
  28.         }
  30.         .contact .info h4 {
  31.             padding: 0 0 0 60px;
  32.             font-size: 22px;
  33.             font-weight: 600;
  34.             margin-bottom: 5px;
  35.             color: #111;
  36.         }
  38.         .contact .info p {
  39.             padding: 0 0 0 60px;
  40.             margin-bottom: 0;
  41.             font-size: 14px;
  42.             color: #444444;
  43.         }
  45.         .contact .info:hover i {
  46.             background: #0084d6;
  47.             color: #fff;
  48.         }
  50.         .contact .php-email-form2 {
  51.             width: 100%;
  52.             box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.12);
  53.             padding: 30px;
  54.             background: #fff;
  55.         }
  57.         .contact .php-email-form2 .form-group {
  58.             padding-bottom: 8px;
  59.         }
  61.         .contact .php-email-form2 .validate {
  62.             display: none;
  63.             color: red;
  64.             margin: 0 0 15px 0;
  65.             font-weight: 400;
  66.             font-size: 13px;
  67.         }
  69.         .contact .php-email-form2 .error-message {
  70.             display: none;
  71.             color: #fff;
  72.             background: #ed3c0d;
  73.             text-align: left;
  74.             padding: 15px;
  75.             font-weight: 600;
  76.         }
  78.         .contact .php-email-form2 .error-message br + br {
  79.             margin-top: 25px;
  80.         }
  82.         .contact .php-email-form2 .sent-message {
  83.             display: none;
  84.             color: #fff;
  85.             background: #0084d6;
  86.             text-align: center;
  87.             padding: 15px;
  88.             font-weight: 600;
  89.         }
  91.         .contact .php-email-form2 .loading {
  92.             display: none;
  93.             background: #fff;
  94.             text-align: center;
  95.             padding: 15px;
  96.         }
  98.         .contact .php-email-form2 .loading:before {
  99.             content: "";
  100.             display: inline-block;
  101.             border-radius: 50%;
  102.             width: 24px;
  103.             height: 24px;
  104.             margin: 0 10px -6px 0;
  105.             border: 3px solid #0084d6;
  106.             border-top-color: #eee;
  107.             -webkit-animation: animate-loading 1s linear infinite;
  108.             animation: animate-loading 1s linear infinite;
  109.         }
  111.         .contact .php-email-form2 input, .contact .php-email-form2 textarea {
  112.             border-radius: 0;
  113.             box-shadow: none;
  114.             font-size: 14px;
  115.             border-radius: 4px;
  116.         }
  118.         .contact .php-email-form2 input:focus, .contact .php-email-form2 textarea:focus {
  119.             border-color: #0084d6;
  120.         }
  122.         .contact .php-email-form2 input {
  123.             height: 44px;
  124.         }
  126.         .contact .php-email-form2 textarea {
  127.             padding: 10px 12px;
  128.         }
  130.         .contact .php-email-form2 button[type="submit"] {
  131.             background: #7f3e98!important;
  132.             border: 0;
  133.             padding: 10px 24px;
  134.             color: #fff;
  135.             transition: 0.4s;
  136.             border-radius: 4px;
  137.         }
  139.         .contact .php-email-form2 button[type="submit"]:hover {
  140.             background: #7f3e98!important;
  141.         }
  142.         a{
  143.             color: #3b3939;!important;
  144.         }
  145.     </style>
  146. {% endblock %}
  148. {% block body %}
  151.     <div class=" d-flex flex-column flex-row-fluid">
  152.         <section id="contact" class="contact">
  153.             <div class="row mb-5 mt-5 justify-content-center" data-aos="">
  154.                 <div class="col-lg-6">
  156.                     <div class="info-wrap">
  157.                         {% for p in phones %}
  158.                             {% if p.isWhatsapp == 1 %}
  159.                                 <p class="fs-6">
  160.                                     <a target="_blank" href="https://api.whatsapp.com/send?phone{{ p.number|replace({' ': ''}) }}=&text=Hi"><span class="bi bi-whatsapp" style="color: green"></span> {{ p.number }}</a>
  161.                                 </p>
  162.                             {% endif %}
  163.                             {% if p.isTelegram == 1 %}
  164.                                 <p class="fs-6">
  165.                                     <span class="bi bi-telegram" style="color: #5959bf"></span> {{ p.number }}
  166.                                 </p>
  167.                             {% endif %}
  168.                         {% endfor %}
  169.                         {% if email !=''  %}
  170.                             <p class="fs-6">
  171.                                 <a target="_blank" href="mailto:{{ email }}"><span class="fa fa-mail-bulk" ></span> {{ email }}</a>
  172.                             </p>
  173.                         {% endif %}
  174.                     </div>
  176.                     <div class="info-wrap">
  177.                         <form action="" method="get" role="form" class="php-email-form2">
  178.                             <div class="form-row">
  179.                                 <div class="col-md-12 form-group">
  180.                                     <input type="text" name="name" class="form-control" id="name" placeholder="{{ 'name'|trans }}" required/>
  181.                                 </div>
  182.                                 <div class="col-md-12 form-group">
  183.                                     <input type="email" class="form-control" name="email" id="email" placeholder="{{ 'email'|trans }}" required/>
  185.                                 </div>
  186.                             </div>
  188.                             <div class="form-group">
  189.                                 <textarea class="form-control" name="message" rows="8"  placeholder="{{ 'message'|trans }}" required></textarea>
  191.                             </div>
  194.                             <div class="form-row" style="align-items: flex-end;margin: 20px">
  195.                                 <div class="col-md-12 form-group ">
  196.                                     <button class="" style="float: right"  type="submit">{{ 'send_message'|trans }}</button>
  198.                                 </div>
  200.                             </div>
  201.                         </form>
  203.                     </div>
  206.                 </div>
  207.                 <div class="col-lg-6">
  208.                     <div class="info-wrap">
  209.                         {% for d in days %}
  210.                             {% set da = 'day_'~d.day  %}
  211.                             <p class="fs-6">
  212.                                 <span class="bi bi-calendar-day"></span> {{ da|trans }} {{ d.start }} - {{ d.end }} <em class="fs-8">{{ 'open'|trans }}</em>
  213.                             </p>
  214.                         {% endfor %}
  215.                     </div>
  216.                     <div class="info-wrap">
  217.                         <p style="display: flex"> {% if twitter != ''%}
  218.                                 <a class="fs-5 m-4" target="_blank" href="{{ twitter }}" class="twitter"><i class="bi bi-twitter" style="color: #669be0"></i> </a> <br/>
  219.                             {% endif %}
  221.                             {% if facebook != '' %}
  222.                                 <a class="fs-5 m-4" target="_blank" href="{{ facebook }}" class="facebook"><i class="bi bi-facebook" style="color: #0492e0"></i> </a> <br/>
  223.                             {% endif %}
  225.                             {% if instagram != ''%}
  226.                                 <a class="fs-5 m-4" target="_blank" href="{{ instagram }}" class="instagram"><i class="bi bi-instagram" style="color: #5b3434"></i> </a> <br/>
  227.                             {% endif %}
  228.                             {% if youtube != ''%}
  229.                                 <a class="fs-5 m-4" target="_blank" href="{{ youtube }}" class="instagram"><i class="bi bi-youtube" style="color: #ec4040"></i> </a> <br/>
  230.                             {% endif %}
  231.                         </p>
  232.                     </div>
  233.                     {% if location_description != '' %}
  234.                         <div class="info-wrap" style="display: flex">
  235.                             <p><span class="fa fa-map-marker-alt" style="margin-right: 8px"></span> {{ location_description|raw }}</p>
  236.                         </div>
  237.                     {% endif %}
  238.                     {% if location_plan != '' %}
  239.                         <div class="info-wrap" id="lightgallery">
  240.                             <div data-aos="fade"data-src="{{ asset('uploads/'~location_plan) }}" >
  241.                                 <a href="{{ asset('uploads/'~location_plan) }}" download><img alt=""   class="img-thumbnail mb-5" style="max-height: 100%; max-width: 100%;" src="{{ asset('uploads/'~location_plan) }}"/></a>
  243.                             </div>
  245.                         </div>
  246.                     {% endif %}
  249.                 </div>
  251.             </div>
  252.         </section><!-- End Contact Section -->
  254.         {% if location_plan != ''%}
  256.             <div class="map-section mt-5 mb-5">
  257.                 {% if google_map != '' %}
  258.                     {{ google_map|raw }}
  259.                 {% endif %}
  260.             </div>
  261.         {% endif %}
  263.     </div>
  265. {% endblock %}
  267.  {% block js %}
  269.  {% endblock %}