templates/mens/home/home_men.twig line 1

  1. {% extends 'mens/base/base_mens.twig' %}
  4. {% block head %}
  5.     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  6.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7.     <meta name="viewport" content="width=device-width,initial-scale=1">
  8.     <meta name="description" content="multikart">
  9.     <meta name="keywords" content="multikart">
  10.     <meta name="author" content="multikart">
  11.     <link rel="icon" href="{{ asset('assets/images/favicon/12.png') }}" type="image/x-icon">
  12.     <link rel="shortcut icon" href="{{ asset('assets/images/favicon/12.png') }}" type="image/x-icon">
  13.     <title>SELECTWEARS</title>
  15.     <!--Google font-->
  16.     <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700,900" rel="stylesheet">
  17.     <link rel="preconnect" href="https://fonts.gstatic.com">
  18.     <link href="https://fonts.googleapis.com/css2?family=Yellowtail&display=swap" rel="stylesheet">
  20.     <!-- Icons -->
  21.  
  22.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/custom.css') }}">
  24.     <!--Slick slider css-->
  25.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/slick.css') }}">
  26.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/slick-theme.css') }}">
  28.     <!-- Animate icon -->
  29.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/animate.css') }}">
  31.     <!-- Themify icon -->
  32.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/themify-icons.css') }}">
  34.     <!-- Bootstrap css -->
  35.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/bootstrap.css') }}">
  37.     <!-- Theme css -->
  38.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/style.css') }}">
  40.     {# Font Awesome 6.4 #}
  41.     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
  42.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/responsive.css') }}">
  44.     <style>
  45.         .ratio2_1 .bg-size:before {
  46.             padding-top: 100% !important;
  47.         }
  48.     </style>
  50. {% endblock %}
  52. {% block breadcrumb %}
  53.         {% include 'mens/base/_breadcrumb.html.twig' %}
  54. {% endblock %}
  56. {% block main %}
  57.     <!-- Home slider -->
  58.     <section class="p-0">
  59.         <div class="slide-1 home-slider">
  60.             <div>
  61.                 <div class="home">
  62.                     <img src="https://images.unsplash.com/photo-1550246140-480ae9bf13c6?auto=format&fit=crop&q=80&w=2070&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="" class="bg-img blur-up lazyload">
  63.                     <div class="container">
  64.                         <div class="row">
  65.                             <div class="col">
  66.                                 <div class="slider-contain">
  67.                                     <div>
  68.                                     <div class="title2 ">
  69.                                         <h2 class="title-inner2 text-light text-blue-men">{{ 'Elevate Your Style with SELECTWEARS' | trans({},'templates') }}</h2>
  70.                                     </div>
  71.                                         {# <h4>Elevate Your Style with SELECTWEARS</h4> #}
  72.                                         <a href="{{ path('app_category',{id: 1}) }}" class="btn btn-solid">{{ 'Discover now' | trans({},'templates') }}</a>
  73.                                         {# <h1>Explore Our Latest Women's Fashion Trends!</h1><a href="#" class="btn btn-solid">Discover now</a> #}
  74.                                     </div>
  75.                                     {# <div class="title2 text-hotpink">
  76.                                         <h2 class="title-inner2 text-light text-hotpink">Elevate Your Style with SELECTWEARS</h2>
  77.                                     </div> #}
  78.                                 </div>
  79.                             </div>
  80.                         </div>
  81.                     </div>
  82.                 </div>
  83.             </div>
  84.             <div>
  85.                 <div class="home">
  86.                     <img src="https://images.unsplash.com/photo-1496346530827-534816eed3be?auto=format&fit=crop&q=80&w=2070&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="" class="bg-img blur-up lazyload">
  87.                     <div class="container">
  88.                         <div class="row">
  89.                             <div class="col">
  90.                                 <div class="slider-contain">
  91.                                     <div>
  92.                                     <div class="title2 ">
  93.                                         <h2 class="title-inner2 text-light text-blue-men">{{ 'Elevate Your Style with SELECTWEARS' | trans({},'templates') }}</h2>
  94.                                     </div>
  95.                                         {# <h4>Elevate Your Style with SELECTWEARS</h4> #}
  96.                                         <a href="{{ path('app_category',{id: 1}) }}" class="btn btn-solid">{{ 'Discover now' | trans({},'templates') }}</a>
  97.                                         {# <h1>Explore Our Latest Women's Fashion Trends!</h1><a href="#" class="btn btn-solid">Discover now</a> #}
  98.                                     </div>
  99.                                     {# <div class="title2 text-hotpink">
  100.                                         <h2 class="title-inner2 text-light text-hotpink">Elevate Your Style with SELECTWEARS</h2>
  101.                                     </div> #}
  102.                                 </div>
  103.                                 {# <div class="slider-contain">
  104.                                     <div>
  105.                                         <h4>welcome to fashion</h4>
  106.                                         <h1>top collection</h1><a href="#" class="btn btn-solid">shop now</a>
  107.                                     </div>
  108.                                 </div> #}
  109.                             </div>
  110.                         </div>
  111.                     </div>
  112.                 </div>
  113.             </div>
  114.             <div>
  115.                 <div class="home">
  116.                     <img src="https://images.unsplash.com/photo-1464666495445-5a33228a808e?auto=format&fit=crop&q=80&w=2012&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="" class="bg-img blur-up lazyload">
  117.                     <div class="container">
  118.                         <div class="row">
  119.                             <div class="col">
  120.                                 <div class="slider-contain">
  121.                                     <div>
  122.                                     <div class="title2 ">
  123.                                         <h2 class="title-inner2 text-light text-blue-men">{{ 'Elevate Your Style with SELECTWEARS' | trans({},'templates') }}</h2>
  124.                                     </div>
  125.                                         {# <h4>Elevate Your Style with SELECTWEARS</h4> #}
  126.                                         <a href="{{ path('app_category',{id: 1}) }}" class="btn btn-solid">{{ 'Discover now' | trans({},'templates') }}</a>
  127.                                         {# <h1>Explore Our Latest Women's Fashion Trends!</h1><a href="#" class="btn btn-solid">Discover now</a> #}
  128.                                     </div>
  129.                                     {# <div class="title2 text-hotpink">
  130.                                         <h2 class="title-inner2 text-light text-hotpink">Elevate Your Style with SELECTWEARS</h2>
  131.                                     </div> #}
  132.                                 </div>
  133.                             </div>
  134.                         </div>
  135.                     </div>
  136.                 </div>
  137.             </div>
  138.         </div>
  139.     </section>
  140.     <!-- Home slider end -->
  142.     <div class="title1 title-fancy section-t-space">
  143.         <h2 class="title-inner1 title-gradient">{{ 'special products' | trans({},'templates') }}</h2>
  144.     </div>
  146.     {% if newArrivals or bestSellers or featuredProducts %}
  147.     <section class="section-b-space pt-0 ratio_asos">
  148.         <div class="container container-lg">
  149.             <div class="row">
  150.                 <div class="col">
  151.                     <div class="theme-tab">
  152.                         <ul class="tabs tab-title">
  154.                             {% if newArrivals %}
  155.                             <li class=""><a href="tab-4">{{ 'New Arrivals' | trans({},'templates') }}</a></li>
  156.                             {% endif %}
  158.                             {% if featuredProducts %}
  159.                             <li class=""><a href="tab-5">{{ 'Featured Products' | trans({},'templates') }}</a></li>
  160.                             {% endif %}
  162.                             {% if bestSellers %}
  163.                             <li class="current"><a href="tab-6">{{ 'Best Sellers' | trans({},'templates') }}</a></li>
  164.                             {% endif %}
  166.                         </ul>
  167.                         <div class="tab-content-cls">
  168.                             {% if newArrivals %}
  169.                             <div id="tab-4" class="tab-content active default new-arrivals-col" style="display: none;">
  170.                                 <div class="no-slider row five-product">
  171.                                     {% for product in newArrivals %}
  172.                                         <div class="product-box">
  173.                                             <div class="img-wrapper">
  174.                                                 <div class="lable-block">
  175.                                                     <span class="lable-gradient">new</span>
  176.                                                     {# <span class="lable4">on sale</span> #}
  177.                                                 </div>
  178.                                                 <div class="front">
  179.                                                     <a href="{{ path('app_product_page',{pid: product.id,vid: product.firstVariantId(),'gender': "mens"}) }}" class="bg-size blur-up lazyloaded" style="background-image: url({{ product.mainImage }}); background-size: cover; background-position: center center; display: block;"><img src="{{ product.mainImage }}" class="img-fluid blur-up lazyload bg-img" alt="" style="display: none;"></a>
  180.                                                 </div>
  181.                                                 <div class="back">
  182.                                                     <a href="{{ path('app_product_page',{pid: product.id, vid: product.firstVariantId(),'gender': "mens"}) }}" class="bg-size blur-up lazyloaded" style="background-image: url({{ product.getSecondImage() }}); background-size: cover; background-position: center center; display: block;"><img src="{{ product.getSecondImage() }}" class="img-fluid blur-up lazyload bg-img" alt="" style="display: none;"></a>
  183.                                                 </div>
  184.                                                 <div class="cart-box cart-box-bottom">
  185.                                                     <a href="javascript:void(0)" onclick="addToFavoris(this)" data-p-id="{{product.id}}" title="Add to Wishlist">
  186.                                                         {% if product.id in app.session.get('wishlist') %}
  187.                                                             <i class='fa-solid fa-heart' style='color: #ff0000;'></i>
  188.                                                         {% else %}
  189.                                                             <i class='fa-regular fa-heart'></i>
  190.                                                         {% endif %}                                                
  191.                                                     </a> 
  192.                                                 </div>
  193.                                             </div>
  194.                                             <div class="product-detail">
  195.                                                 <a href="{{ path('app_product_page',{pid: product.id, vid: product.firstVariantId(),'gender': "mens"}) }}">
  196.                                                     <h6>{{ product.name }}</h6>
  197.                                                 </a>
  198.                                                 <h4>{{ product.firstVariantPrice() }} EUR</h4>
  199.                                             </div>
  200.                                         </div>
  201.                                     {% endfor %}
  202.                                 </div>
  203.                             </div>
  204.                             {% endif %}
  206.                             {% if featuredProducts %}
  207.                             <div id="tab-5" class="tab-content " style="display: none;">
  208.                                 <div class="no-slider row five-product">
  209.                                     {% for product in featuredProducts %}
  210.                                      <div class="product-box">
  211.                                             <div class="img-wrapper">
  212.                                                 <div class="lable-block">
  213.                                                     {# <span class="lable-gradient">new</span> #}
  214.                                                     <span class="lable4">best seller</span>
  215.                                                 </div>
  216.                                                 <div class="front">
  217.                                                     <a href="{{ path('app_product_page',{pid: product.id,vid: product.firstVariantId(),'gender': "mens"}) }}" class="bg-size blur-up lazyloaded" style="background-image: url({{ product.mainImage }}); background-size: cover; background-position: center center; display: block;"><img src="{{ product.mainImage }}" class="img-fluid blur-up lazyload bg-img" alt="" style="display: none;"></a>
  218.                                                 </div>
  219.                                                 <div class="back">
  220.                                                     <a href="{{ path('app_product_page',{pid: product.id,vid: product.firstVariantId(),'gender': "mens"}) }}" class="bg-size blur-up lazyloaded" style="background-image: url({{ product.getSecondImage() }}); background-size: cover; background-position: center center; display: block;"><img src="{{ product.getSecondImage() }}" class="img-fluid blur-up lazyload bg-img" alt="" style="display: none;"></a>
  221.                                                 </div>
  222.                                                 <div class="cart-box cart-box-bottom">
  223.                                                     <a href="javascript:void(0)" onclick="addToFavoris(this)" data-p-id="{{product.id}}" title="Add to Wishlist">
  224.                                                         {% if product.id in app.session.get('wishlist') %}
  225.                                                             <i class='fa-solid fa-heart' style='color: #ff0000;'></i>
  226.                                                         {% else %}
  227.                                                             <i class='fa-regular fa-heart'></i>
  228.                                                         {% endif %}                                                
  229.                                                     </a>
  230.                                                 </div>
  231.                                             </div>
  232.                                             <div class="product-detail">
  233.                                                 <a href="{{ path('app_product_page',{pid: product.id,vid: product.firstVariantId(),'gender': "mens"}) }}">
  234.                                                     <h6>{{ product.name }}</h6>
  235.                                                 </a>
  236.                                                 <h4>{{ product.firstVariantPrice() }} EUR</h4>
  237.                                             </div>
  238.                                      </div>
  239.                                     {% endfor %}
  240.                                 </div>
  241.                             </div>
  242.                             {% endif %}
  244.                             {% if bestSellers %}
  245.                             <div id="tab-6" class="tab-content best-sellers-col" style="display: none;">
  246.                                 <div class="no-slider row five-product">
  247.                                     {% for product in bestSellers %}
  248.                                       <div class="product-box">
  249.                                             <div class="img-wrapper">
  250.                                                 <div class="lable-block">
  251.                                                     {# <span class="lable-gradient">new</span> #}
  252.                                                     <span class="lable4">best seller</span>
  253.                                                 </div>
  254.                                                 <div class="front">
  255.                                                     <a href="{{ path('app_product_page',{pid: product.id,vid: product.firstVariantId(),'gender': "mens"}) }}" class="bg-size blur-up lazyloaded" style="background-image: url({{ product.mainImage }}); background-size: cover; background-position: center center; display: block;"><img src="{{ product.mainImage }}" class="img-fluid blur-up lazyload bg-img" alt="" style="display: none;"></a>
  256.                                                 </div>
  257.                                                 <div class="back">
  258.                                                     <a href="{{ path('app_product_page',{pid: product.id,vid: product.firstVariantId(),'gender': "mens"}) }}" class="bg-size blur-up lazyloaded" style="background-image: url({{ product.getSecondImage() }}); background-size: cover; background-position: center center; display: block;"><img src="{{ product.getSecondImage() }}" class="img-fluid blur-up lazyload bg-img" alt="" style="display: none;"></a>
  259.                                                 </div>
  260.                                                 <div class="cart-box cart-box-bottom">
  261.                                                     <a href="javascript:void(0)" onclick="addToFavoris(this)" data-p-id="{{product.id}}" title="Add to Wishlist">
  262.                                                         {% if product.id in app.session.get('wishlist') %}
  263.                                                             <i class='fa-solid fa-heart' style='color: #ff0000;'></i>
  264.                                                         {% else %}
  265.                                                             <i class='fa-regular fa-heart'></i>
  266.                                                         {% endif %}                                                
  267.                                                     </a>
  268.                                                 </div>
  269.                                             </div>
  270.                                             <div class="product-detail">
  271.                                                 {# <div class="rating"><i class="fa fa-star"></i> <i class="fa fa-star"></i>
  272.                                                     <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i>
  273.                                                 </div> #}
  274.                                                 <a href="{{ path('app_product_page',{pid: product.id,vid: product.firstVariantId(),'gender': "mens"}) }}">
  275.                                                     <h6>{{ product.name }}</h6>
  276.                                                 </a>
  277.                                                 <h4>{{ product.firstVariantPrice() }} EUR</h4>
  278.                                                 {# <ul class="color-variant">
  279.                                                     <li class="bg-light0"></li>
  280.                                                     <li class="bg-light1"></li>
  281.                                                     <li class="bg-light2"></li>
  282.                                                 </ul> #}
  283.                                             </div>
  284.                                         </div>
  285.                                     {% endfor %}
  286.                                 </div>
  287.                             </div>
  288.                             {% endif %}
  289.                         </div>
  290.                     </div>
  291.                 </div>
  292.             </div>
  293.         </div>
  294.     </section>
  295.     {% endif %}
  297.     <!-- collection banner -->
  298.     <section class="banner-padding banner-furniture ratio2_1">
  299.         <div class="container container-lg">
  300.             <div class="row partition3">
  301.                 <div class="col-12">
  302.                     <div class="title1 title-fancy">
  303.                         <h2 class="title-inner1 title-gradient">{{ 'Explore Our Collections' | trans({},'templates') }}</h2>
  304.                     </div>
  305.                 </div>
  306.             {% for collection in featuredCollections %}
  307.                 <div class="col-md-3 pt-4">
  308.                     <a href="{{ path('app_collection',{id: collection.id,gender: "mens" }) }}">
  309.                         <div class="collection-banner collection-raduis p-left text-start">
  310.                             <div class="img-part">
  311.                                 <img src="/uploads/collections/{{ collection.image }}" alt=""
  312.                                     class="img-fluid blur-up lazyload bg-img">
  313.                             </div>
  314.                             <div class="contain-banner">
  315.                                 <div class="col-12 d-flex justify-content-center">
  316.                                     {# <h4>save 30%</h4> #}
  317.                                     <h2 class="text-white text-center text-stroke">{{ collection.name }}</h2>
  318.                                 </div>
  319.                             </div>
  320.                         </div>
  321.                     </a>
  322.                 </div>
  323.             {% endfor %}
  324.             </div>
  325.         </div>
  326.     </section>
  330.     <!-- tap to top start -->
  331.     <div class="tap-top">
  332.         <div><i class="fa fa-angle-double-up"></i></div>
  333.     </div>
  334.     <!-- tap to top end -->
  336. {% endblock %}
  338.  {% block newsletter %}
  339.                 {% include 'front_end/base/newsletter.twig' %}
  340. {% endblock %}
  342. {% block js %}
  343.     <!-- latest jquery-->
  344.     <script src="{{ asset('assets/js/jquery-3.3.1.min.js') }}"></script>
  346.     <!-- menu js-->
  347.     <script src="{{ asset('assets/js/menu.js') }}"></script>
  349.     <!-- lazyload js-->
  350.     <script src="{{ asset('assets/js/lazysizes.min.js') }}"></script>
  352.     <!-- slick js-->
  353.     <script src="{{ asset('assets/js/slick.js') }}"></script>
  355.     <!-- Bootstrap js-->
  356.     <script src="{{ asset('assets/js/bootstrap.bundle.min.js') }}"></script>
  358.     <!-- Bootstrap Notification js-->
  359.     <script src="{{ asset('assets/js/bootstrap-notify.min.js') }}"></script>
  361.     <!-- Theme js-->
  362.     <script src="{{ asset('assets/js/theme-setting.js') }}"></script>
  363.     <script src="{{ asset('assets/js/script.js') }}"></script>
  365.     <script src="{{ asset('assets/js/modules.js') }}"></script>
  367.     <script>
  368.         $(window).on('load', function () {
  369.             setTimeout(function () {
  370.                 $('#exampleModal').modal('show');
  371.             }, 2500);
  372.         });
  374.         function openSearch() {
  375.             document.getElementById("search-overlay").style.display = "block";
  376.         }
  378.         function closeSearch() {
  379.             document.getElementById("search-overlay").style.display = "none";
  380.         }
  381.     </script>
  382. {% endblock %}