templates/Frontend/Index/index.html.twig line 216

Open in your IDE?
  1. {% extends 'Frontend/base.html.twig' %}
  2. {% block body %}
  3.     
  4.     
  5. <div class='containerr p-t-25'>
  6.     <div id="homeSlides" class="carousel slide" data-ride="carousel">
  7.       <div class="carousel-inner">          
  9.           {% for item in slides %}          
  10.                 {% if loop.index == 1 %}
  11.                     {% set activeFlag = 'active' %}
  12.                 {% else %}
  13.                     {% set activeFlag = '' %}            
  14.                 {% endif %}
  15.                   <div class="carousel-item {{activeFlag}} " data-interval="10000" >
  16.                     {% if item.text1 == '' and item.text2 == '' %}  
  17.                   <div class="d-block w-100" style="background-image:url('{{item.imagePath}}');background-size:cover;background-repeat:no-repeat;background-position:top center;width:100%;height:700px;" alt="">
  18.                   {% else %}
  19.                   <div class="d-block w-100" style="background:linear-gradient(0deg,rgba(0, 0, 0, {% if item.gradientLower != '' %} 0.{{item.gradientLower}}{% else %}0.0{% endif %}),rgba(0, 0, 0,{% if item.gradientHigher != '' %} 0.{{item.gradientHigher}}{% else %}0.0{% endif %})), url('{{item.imagePath}}');background-size:cover;background-repeat:no-repeat;background-position:top center;width:100%;height:700px;" alt="">                  
  20.                   {% endif %}
  21.                     <div class="container h-full">
  22.                             
  23.                         <div class="flex-col-l-m h-full p-t-100 p-b-30 respon5">
  24.                             <div class="animated fadeIn " style="width:100%;{%if item.textAlignment == ''%}text-align:left !important;{%else%}text-align:{{item.textAlignment}} !important;{%endif%}">
  25.                                 <span class="ltext-101 cl2 respon2" style='color:#{{item.text1color}} !important;'>
  26.                                     {{item.text1}}
  27.                                 </span>
  28.                             </div>                                
  29.                             <div class="animated fadeIn " style="width:100%;{%if item.textAlignment == ''%}text-align:left !important;{%else%}text-align:{{item.textAlignment}} !important;{%endif%}">
  30.                                 <h2 class="ltext-201 cl2 p-t-19 p-b-43 respon1" style='color:#{{item.text2color}} !important;'>
  31.                                     {{item.text2}}
  32.                                 </h2>
  33.                             </div>                                                            
  34.                         </div>
  35.                         
  36.                                             
  37.                     </div>        
  38.                       
  39.                   </div>
  40.                 </div>                          
  41.           {% endfor %}
  42.                   
  44.       </div>
  45.       <a class="carousel-control-prev" href="#homeSlides" role="button" data-slide="prev">
  46.         <span class="carousel-control-prev-icon" aria-hidden="true"></span>
  47.         <span class="sr-only">Anterior</span>
  48.       </a>
  49.       <a class="carousel-control-next" href="#homeSlides" role="button" data-slide="next">
  50.         <span class="carousel-control-next-icon" aria-hidden="true"></span>
  51.         <span class="sr-only">Siguiente</span>
  52.       </a>
  53.     </div>
  54. </div>    
  59. <!---- MARCAS ---->
  60. {% if brands | length > 0 %}
  61.     {% if webSetting.brandTitle != '' and webSetting.brandSubtitle != '' %}
  62.         <div class='row bg-img1 bg-background-color' style='margin-right:0px;margin-left:0px;'>
  63.             <div class='col-12'>
  64.                 <section class="txt-center p-lr-15 p-tb-52 text_color_main">
  65.                     <h2 class="ltext-105 txt-center">
  66.                         {{webSetting.brandTitle}}
  67.                     </h2>
  68.                     <p>{{webSetting.brandSubtitle}}</p>
  69.                 </section>
  70.             </div>    
  71.         </div>
  72.     {% endif %}    
  73. <!-- Banner -->
  74. <div class="sec-banner bg0 p-t-30">
  75.     <div class="container">
  76.         <div class="row">
  77.                 
  78.             {% for item in brands %}
  79.                 {% if item.featured == 1 %}
  80.                     {% if item.brand_count > 0 %}
  81.                         <div class="col-md-6 col-xl-4 p-b-30 m-lr-auto">
  82.                                                         
  83.                             <div class="block1 wrap-pic-w bkg_block" style='background-size:cover !important;background:linear-gradient(0deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.2)), url("{{asset("uploads/brand/"~item.image_path) }}");'>            
  84.                                 <a href="{{ path('frontend_product', {'brand': item.brand_id, slug:slug}) }}" class="block1-txt ab-t-l s-full flex-col-l-sb p-lr-38 p-tb-34 trans-03 respon3">
  85.                                     <div class="block1-txt-child1 flex-col-l">
  86.                                         <span class="block1-name ltext-102 trans-04 p-b-8">
  87.                                             {{item.name}}
  88.                                         </span>            
  89.                                         <span class="block1-info stext-102 trans-04">                                    
  90.                                             {{item.brand_count}} {% if item.brand_count != 1 %}Productos{%else%}Producto{%endif%}                                    
  91.                                         </span>
  92.                                     </div>            
  93.                                     <div class="block1-txt-child2 p-b-4 trans-05">
  94.                                         <div class="block1-link stext-101 cl0 trans-09">
  95.                                             Ver más
  96.                                         </div>
  97.                                     </div>
  98.                                 </a>
  99.                             </div>
  100.                             
  101.                         </div>
  102.                     {% endif %}
  103.                 {% endif %}
  104.             {% endfor %}
  105.     
  106.         </div>
  107.     </div>
  108. </div>
  109. {% endif %}
  112. <!---- CATEGORIAS ---->
  114. {% if categories | length > 0 %}
  115.     {% if webSetting.categoryTitle != '' and webSetting.categorySubtitle != '' %}
  116.         <div class='row bg-img1 bg-background-color' style='margin-right:0px;margin-left:0px;'>
  117.             <div class='col-12'>
  118.                 <section class="txt-center p-lr-15 p-tb-52 text_color_main">
  119.                     <h2 class="ltext-105 txt-center">
  120.                         {{webSetting.categoryTitle}}
  121.                     </h2>
  122.                     <p>{{webSetting.categorySubtitle}}</p>
  123.                 </section>
  124.             </div>    
  125.         </div>
  126.     {% endif %}    
  127. <!-- Banner -->
  128. <div class="sec-banner bg0 p-t-30">
  129.     <div class="container">
  130.         <div class="row">
  131.                 
  132.             {% for item in categories %}
  133.                 {% if item.featured == 1 %}
  134.                     {% if item.category_count > 0 %}
  135.                         <div class="col-md-6 col-xl-4 p-b-30 m-lr-auto">
  136.                                                         
  137.                             <div class="block1 wrap-pic-w bkg_block" style='background:linear-gradient(0deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.2)), url("{{item.image_path}}");'>            
  138.                                 <a href="{{ path('frontend_product', {'category': item.category_id, slug:slug}) }}" class="block1-txt ab-t-l s-full flex-col-l-sb p-lr-38 p-tb-34 trans-03 respon3">
  139.                                     <div class="block1-txt-child1 flex-col-l">
  140.                                         <span class="block1-name ltext-102 trans-04 p-b-8">
  141.                                             {{item.name}}
  142.                                         </span>            
  143.                                         <span class="block1-info stext-102 trans-04">                                    
  144.                                             {{item.category_count}} {% if item.category_count != 1 %}Productos{%else%}Producto{%endif%}                                        
  145.                                         </span>
  146.                                     </div>            
  147.                                     <div class="block1-txt-child2 p-b-4 trans-05">
  148.                                         <div class="block1-link stext-101 cl0 trans-09">
  149.                                             Ver más
  150.                                         </div>
  151.                                     </div>
  152.                                 </a>
  153.                             </div>
  154.                             
  155.                         </div>
  156.                     {% endif %}
  157.                 {% endif %}
  158.             {% endfor %}
  159.     
  160.         </div>
  161.     </div>
  162. </div>
  164. {% endif %}
  166. <!---- BLOGS ---->
  168. {% if blogs | length > 0 %}
  169.     {% if webSetting.blogTitle != '' and webSetting.blogSubtitle != '' %}
  170.         <div class='row bg-img1 bg-background-color' style='margin-right:0px;margin-left:0px;'>
  171.             <div class='col-12'>
  172.                 <section class="txt-center p-lr-15 p-tb-52 text_color_main">
  173.                     <h2 class="ltext-105 txt-center">
  174.                         {{webSetting.blogTitle}}
  175.                     </h2>
  176.                     <p>
  177.                         {{webSetting.blogSubtitle}}
  178.                     </p>
  179.                 </section>
  180.             </div>    
  181.         </div>
  182.     {% endif %}    
  183.     <!-- Banner -->
  184.     <div class="sec-banner bg0 p-t-30">
  185.         <div class="container">
  186.             <div class="row justify-content-md-center">                        
  187.                 {% for blog in blogs %}
  188.                 
  189.                     <div class="col-lg-4" style="padding-top: 10px">
  190.                         <div class="card">
  191.                             <img  class="card-img-top" src="{{ asset('uploads/blog/'~blog.coverPath) }}" alt="Image" onerror="this.onerror=null;this.src='{{asset("images/no_image.png")}}'" onclick="window.location.href='{{ path('frontend_blog_detail', {'blogId': blog.blogId|nzo_encrypt, 'from_inicio': true, slug:slug}) }}'">
  192.                             <div class="card-body" >                
  193.                                 <h5 class="card-title" style='margin-bottom:0px;'>
  194.                                     <a href="{{ path('frontend_blog_detail', {'blogId': blog.blogId|nzo_encrypt, 'from_inicio': true, slug:slug}) }}">
  195.                                         {{blog.title}}
  196.                                     </a>
  197.                                 </h5>
  198.                                 <small style='color:#ccc'>{{ blog.createdAt | date('F m, Y')}}{% if blog.blogCategory %} | {{blog.blogCategory.name}}{% endif %}</small>
  199.                                 <br><br>
  200.                                 <div style='min-height: 130px;'>
  201.                                     <p class="card-text">{{ blog.shortContent| slice(0, 200)}}{% if blog.shortContent|raw |length > 200 %} ...{%endif%}</p>
  202.                                 </div>
  203.                             </div>
  204.                         </div>
  205.                     </div>
  206.                 
  207.                 {% endfor %}
  208.             </div>
  209.         </div>
  210.     </div>
  211. {% endif %}
  214. <!-- LOAD ITEMS DINAMICALLY -->
  215. <br>
  216. {{ include('Frontend/product.html.twig', {filter:true, webSetting: webSetting, slug: slug}) }}
  217.     
  218. {% endblock %}