templates/services/sub-service.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}{{page.title|default('')}}{% endblock %}
  5. {% block metas %}
  6.     <meta name="title" content="{{meta.title|default('')}}">
  7.     <meta name="description" content="{{meta.description}}">
  8. {% endblock %}
  10. {% block stylesheets %}
  11.     {{ parent() }}
  12. {% endblock %}
  14. {% block body %}
  15.     {% include '/partials/header.html.twig' with {'header_theme': 'dark', 'current_page':'services'} %}
  16.     <!-- Main Content -->
  17.     <main class="main-content">
  18.         <!-- Sub Service Intro Area -->
  19.         <div class="tm-section subservices-introduction-area tm-padding-section bg-white pb-3">
  20.             <div class="container position-relative">
  21.                 <div class="row">
  22.                     <div class="col-lg-6 pt-lg-5">
  23.                         <div class="subservice-title">{{page.content.title | raw}}</div>
  24.                         <p>
  25.                             {{page.content.description | raw}}
  26.                         </p>
  27.                     </div>
  28.                     <div class="col-lg-6 text-center">
  29.                         <img class="subservice-illustration" src="{{ asset(subservice_illustration_image) }}" alt="Pixelsior avatar">
  30.                     </div>
  31.                 </div>
  32.                 <div class="row">
  33.                     <div class="col-lg-12">
  34.                         <ul class="nav nav-tabs justify-content-center" id="subserviceTab" role="tablist">
  35.                             {% for key, subservice in subservices %}
  36.                             <li class="nav-item" role="presentation">
  37.                                 <button class="nav-link {{subservice.active ? 'active':''}}"  id="{{subservice.nav.id}}" data-bs-toggle="tab" data-bs-target="{{subservice.nav.target}}" type="button" role="tab" aria-controls="{{subservice.nav.controls}}" aria-selected="true">{{subservice.title}}</button>
  38.                             </li>
  39.                             {% endfor %}
  40.                         </ul>
  41.                         <div class="tab-content" id="subserviceTabContent">
  42.                             {% for subservice in subservices %}
  43.                             <div class="tab-pane fade {{subservice.active ? 'show active':''}}" id="{{subservice.id}}" role="tabpanel" aria-labelledby="{{subservice.nav.id}}">
  44.                                 <p class="subservice-item-description text-center mt-3">{{subservice.description | raw}}</p>
  45.                                 <div class="feed-container mt-5">
  46.                                     <div class="feed">
  47.                                         {% for subservice_item in subservice.nav.items %}
  48.                                         <div class="feed-item">
  49.                                             <img src="{{ asset(subservice_item.img) }}" alt="Element du sous-service">
  50.                                         </div>
  51.                                         {% endfor %}
  52.                                     </div>
  53.                                 </div>
  54.                             </div>
  55.                             {% endfor %}
  56.                         </div>
  57.                     </div>
  58.                 </div>
  59.             </div>
  60.         </div>
  61.         <!-- Sub Service Intro Area -->
  63.         <!-- Tarifs Area -->
  64.         {# <div class="tm-section tarifs-area tm-padding-section bg-white">
  65.             <div class="container position-relative">
  66.                 <h2 class="text-center">Nos tarifs<span class="text-yellow">.</span></h2>
  67.                 <p class="text-center mw-75">{{ tarifs.description | raw}}</p>
  68.                 <img class="leaf leaf-3" src="{{ asset('assets/images/webp/leaf-3.webp') }}" alt="Feuille n°3">
  69.                 <img class="leaf leaf-2" src="{{ asset('assets/images/webp/leaf-2.webp') }}" alt="Feuille n°2">
  70.                 <img class="leaf leaf-1" src="{{ asset('assets/images/webp/leaf-1.webp') }}" alt="Feuille n°1">
  72.                 <div class="row">
  73.                     <div class="col-lg-12">
  74.                         <div class="tarifs">
  75.                             {% for item in tarifs.items %}
  76.                                 <div class="tarif-item" {% if tarif_item_padding is defined and tarif_item_margin is defined %} style="padding: {{tarif_item_padding}}; margin: {{tarif_item_margin}};" {% endif %} >
  77.                                     <h3 style="min-height: 65px;">{{item.product}}</h3>
  78.                                     <div class="tarif_pricing_block mb-1" style="min-height: 85px;">
  79.                                         {% if item.__price is defined %} <span> {{item.__price}} </span> {% endif %}
  80.                                         <div class="tarif-pricing">{{item.price}} €</div>
  81.                                     </div>
  82.                                     
  83.                                     {% if item.list_group|length > 1 %}
  84.                                         <ul class="list-group">
  85.                                             {% for _item in item.list_group %}
  86.                                                 <li class="list-group-item {% if tarif_item_text_align is defined %} {{tarif_item_text_align}} {% endif %} ">{{_item|raw}} <span><i class="fas fa-check-circle ms-2"></i></span></li>
  87.                                             {% endfor %}
  88.                                         </ul> 
  89.                                     {% else %} 
  90.                                         <ul class="list-group">
  91.                                             <li class="list-group-item">{{item.list_group.0|raw}}<span></span></li>
  92.                                         </ul> 
  93.                                     {% endif %} 
  95.                                     <a href="{{ custom_path('app_contact', {price: item.price, product: item.product}) }}" class="tm-button button-blu mt-3">Obtenir un devis</a>
  96.                                 </div>
  97.                             {% endfor %}
  98.                         </div>
  99.                     </div>
  100.                 </div>
  101.             </div>
  102.         </div> #}
  103.         <!-- Tarifs Area -->
  106.         {% include '/partials/contact_us.html.twig' %}
  108.     </main>
  109.     <!--// Main Content -->
  110.    
  111. {% endblock %}
  113. {% block javascripts %}
  114.     {{ parent() }}
  115.     <script>
  116.         // $("._js_toogle_content").hover(mouseEnter, mouseLeave)
  117.         // function mouseEnter() {
  118.         //     $(this).animate({height: '100vh'}, "slow"); 
  119.         // };
  120.         // function mouseLeave() {
  121.         //     $(this).animate({height: '300px'}, "slow");
  122.         // };
  124.       
  125.         // $("._js_toogle_content").click(function(){
  126.         //     if ($(this).hasClass('is_small') ) {
  127.         //         $(this).animate({height: '100vh'}, "slow");
  128.         //         $(this).removeClass('is_small');
  129.         //         $(this).addClass('is_large');
  130.         //     }else if($(this).hasClass('is_large')){
  131.         //         $(this).animate({height: '300px'}, "slow");
  132.         //         $(this).removeClass('is_large');
  133.         //         $(this).addClass('is_small');
  134.         //     }
  135.         // });
  136.     </script>
  137. {% endblock %}