templates/categorie/long_cartBoutique.html.twig line 1

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.   
  4. <head>
  5.     <meta charset="utf-8">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, viewport-fit=cover, shrink-to-fit=no">
  7.     <meta name="description" content="Suha - Multipurpose Ecommerce Mobile HTML Template">
  8.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  9.     <meta name="theme-color" content="#100DD1">
  10.     <meta name="apple-mobile-web-app-capable" content="yes">
  11.     <meta name="apple-mobile-web-app-status-bar-style" content="black">
  12.     <!-- The above tags *must* come first in the head, any other head content must come *after* these tags -->
  13.     <!-- Title -->
  14.     <title>Suha - Multipurpose Ecommerce Mobile HTML Template</title>
  15.     <link rel="preconnect" href="https://fonts.googleapis.com/">
  16.     <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin>
  17.     <link href="https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@300;400;500;600;700&amp;display=swap" rel="stylesheet">
  18.     <!-- Favicon -->
  19.    {% block stylesheets %}
  20.             {{ encore_entry_link_tags('app') }}
  21.         
  23.     <link rel="icon" href="{{asset('img/icons/icon-72x72.png')}}">
  24.     <!-- Apple Touch Icon -->
  25.     <link rel="apple-touch-icon" href="{{asset('img/icons/icon-96x96.png')}}">
  26.     <link rel="apple-touch-icon" sizes="152x152" href="{{asset('img/icons/icon-152x152.png')}}">
  27.     <link rel="apple-touch-icon" sizes="167x167" href="{{asset('img/icons/icon-167x167.png')}}">
  28.     <link rel="apple-touch-icon" sizes="180x180" href="{{asset('img/icons/icon-180x180.png')}}">
  29.     <!-- CSS Libraries -->
  30.     <link rel="stylesheet" href="{{asset('css/bootstrap.min.css')}}">
  31.     <link rel="stylesheet" href="{{asset('css/animate.css')}}">
  32.     <link rel="stylesheet" href="{{asset('css/all.min.css')}}">
  33.     <link rel="stylesheet" href="{{asset('css/brands.min.css')}}">
  34.     <link rel="stylesheet" href="{{asset('css/solid.min.css')}}">
  35.     <link rel="stylesheet" href="{{asset('css/owl.carousel.min.css')}}">
  36.     <link rel="stylesheet" href="{{asset('css/magnific-popup.css')}}">
  37.     <link rel="stylesheet" href="{{asset('css/nice-select.css')}}">
  38.     <!-- Stylesheet -->
  39.     <link rel="stylesheet" href="{{asset('css/style.css')}}">
  40.     <link rel="stylesheet" href="{{asset('css/card.css')}}">
  41.     
  42.     <!-- Web App Manifest -->
  43.     <link rel="manifest" href="{{asset('js/manifest.json')}}">
  45.     {% endblock %}
  47.   </head>
  48.   <body>
  49.     {% block body %}
  51.     <!-- Header Area-->
  52.     <div class="header-area" id="headerArea">
  53.       <div class="container h-100 d-flex align-items-center justify-content-between rtl-flex-d-row-r">
  54.         <!-- Back Button-->
  56.         {% if app.user and app.user.compte == 'client' %}
  58.         <div class="back-button me-2">
  59.           <a href="{{path('app_main_particulier')}}">
  60.           <i class="fa-solid fa-arrow-left-long"></i>
  61.          </a>
  62.        </div>
  64.        {% elseif app.user and app.user.compte == 'vendeur' %}
  66.         <div class="back-button me-2">
  67.           <a href="{{path('app_main')}}">
  68.           <i class="fa-solid fa-arrow-left-long"></i>
  69.          </a>
  70.        </div>
  72.        {% else %}
  74.       <div class="back-button me-2">
  75.         <a href="{{ path('app_main')}}"><i class="fa-solid fa-arrow-left-long"></i></a>
  76.       </div>
  78.       {% endif %}
  80.         <!-- Page Title-->
  81.         <div class="page-heading">
  82.           <h6 class="mb-0">Nos produits en Boutique</h6>
  83.         </div>
  84.         <!-- Filter Option
  85.         <div class="filter-option ms-2" data-bs-toggle="offcanvas" data-bs-target="#suhaFilterOffcanvas" aria-controls="suhaFilterOffcanvas"><i class="fa-solid fa-sliders"></i></div>-->
  87.         <div class="filter-option ms-2" data-bs-toggle="offcanvas"  aria-controls="suhaFilterOffcanvas"><i class="fa-solid fa-sliders"></i></div>
  88.       </div>
  89.     </div>
  90.     <div class="offcanvas offcanvas-start suha-filter-offcanvas-wrap" tabindex="-1" id="suhaFilterOffcanvas" aria-labelledby="suhaFilterOffcanvasLabel">
  91.       <!-- Close button-->
  92.       <button class="btn-close text-reset" type="button" data-bs-dismiss="offcanvas" aria-label="Close"></button>
  93.       <!-- Offcanvas body-->
  94.       <div class="offcanvas-body py-5">
  95.         <div class="container">
  96.           <div class="row">
  97.             <div class="col-12">
  98.               <!-- Catagory-->
  99.               <div class="widget catagory mb-4">
  100.                 <h6 class="widget-title mb-2">Brand</h6>
  101.                 <div class="widget-desc">
  102.                   <!-- Single Checkbox-->
  103.                   <div class="form-check">
  104.                     <input class="form-check-input" id="zara" type="checkbox" checked>
  105.                     <label class="form-check-label" for="zara">Zara</label>
  106.                   </div>
  107.                   <!-- Single Checkbox-->
  108.                   <div class="form-check">
  109.                     <input class="form-check-input" id="Gucci" type="checkbox">
  110.                     <label class="form-check-label" for="Gucci">Gucci</label>
  111.                   </div>
  112.                   <!-- Single Checkbox-->
  113.                   <div class="form-check">
  114.                     <input class="form-check-input" id="Addidas" type="checkbox">
  115.                     <label class="form-check-label" for="Addidas">Addidas</label>
  116.                   </div>
  117.                   <!-- Single Checkbox-->
  118.                   <div class="form-check">
  119.                     <input class="form-check-input" id="Nike" type="checkbox">
  120.                     <label class="form-check-label" for="Nike">Nike</label>
  121.                   </div>
  122.                   <!-- Single Checkbox-->
  123.                   <div class="form-check">
  124.                     <input class="form-check-input" id="Denim" type="checkbox">
  125.                     <label class="form-check-label" for="Denim">Denim</label>
  126.                   </div>
  127.                 </div>
  128.               </div>
  129.             </div>
  130.             <div class="col-12">
  131.               <!-- Color-->
  132.               <div class="widget color mb-4">
  133.                 <h6 class="widget-title mb-2">Color Family</h6>
  134.                 <div class="widget-desc">
  135.                   <!-- Single Checkbox-->
  136.                   <div class="form-check">
  137.                     <input class="form-check-input" id="Purple" type="checkbox" checked>
  138.                     <label class="form-check-label" for="Purple">Purple</label>
  139.                   </div>
  140.                   <!-- Single Checkbox-->
  141.                   <div class="form-check">
  142.                     <input class="form-check-input" id="Black" type="checkbox">
  143.                     <label class="form-check-label" for="Black">Black</label>
  144.                   </div>
  145.                   <!-- Single Checkbox-->
  146.                   <div class="form-check">
  147.                     <input class="form-check-input" id="White" type="checkbox">
  148.                     <label class="form-check-label" for="White">White</label>
  149.                   </div>
  150.                   <!-- Single Checkbox-->
  151.                   <div class="form-check">
  152.                     <input class="form-check-input" id="Red" type="checkbox">
  153.                     <label class="form-check-label" for="Red">Red</label>
  154.                   </div>
  155.                   <!-- Single Checkbox-->
  156.                   <div class="form-check">
  157.                     <input class="form-check-input" id="Pink" type="checkbox">
  158.                     <label class="form-check-label" for="Pink">Pink</label>
  159.                   </div>
  160.                 </div>
  161.               </div>
  162.             </div>
  163.             <div class="col-12">
  164.               <!-- Size-->
  165.               <div class="widget size mb-4">
  166.                 <h6 class="widget-title mb-2">Size</h6>
  167.                 <div class="widget-desc">
  168.                   <!-- Single Checkbox-->
  169.                   <div class="form-check">
  170.                     <input class="form-check-input" id="XtraLarge" type="checkbox" checked>
  171.                     <label class="form-check-label" for="XtraLarge">Xtra Large</label>
  172.                   </div>
  173.                   <!-- Single Checkbox-->
  174.                   <div class="form-check">
  175.                     <input class="form-check-input" id="Large" type="checkbox">
  176.                     <label class="form-check-label" for="Large">Large</label>
  177.                   </div>
  178.                   <!-- Single Checkbox-->
  179.                   <div class="form-check">
  180.                     <input class="form-check-input" id="medium" type="checkbox">
  181.                     <label class="form-check-label" for="medium">Medium</label>
  182.                   </div>
  183.                   <!-- Single Checkbox-->
  184.                   <div class="form-check">
  185.                     <input class="form-check-input" id="Small" type="checkbox">
  186.                     <label class="form-check-label" for="Small">Small</label>
  187.                   </div>
  188.                   <!-- Single Checkbox-->
  189.                   <div class="form-check">
  190.                     <input class="form-check-input" id="ExtraSmall" type="checkbox">
  191.                     <label class="form-check-label" for="ExtraSmall">Extra Small</label>
  192.                   </div>
  193.                 </div>
  194.               </div>
  195.             </div>
  196.             <div class="col-12">
  197.               <!-- Ratings-->
  198.               <div class="widget ratings mb-4">
  199.                 <h6 class="widget-title mb-2">Ratings</h6>
  200.                 <div class="widget-desc">
  201.                   <!-- Single Checkbox-->
  202.                   <div class="form-check">
  203.                     <input class="form-check-input" id="5star" type="checkbox" checked>
  204.                     <label class="form-check-label" for="5star"><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-warning"></i></label>
  205.                   </div>
  206.                   <!-- Single Checkbox-->
  207.                   <div class="form-check">
  208.                     <input class="form-check-input" id="4star" type="checkbox">
  209.                     <label class="form-check-label" for="4star"><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-secondary"></i></label>
  210.                   </div>
  211.                   <!-- Single Checkbox-->
  212.                   <div class="form-check">
  213.                     <input class="form-check-input" id="3star" type="checkbox">
  214.                     <label class="form-check-label" for="3star"><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-secondary"></i><i class="fa-solid fa-star text-secondary"></i></label>
  215.                   </div>
  216.                   <!-- Single Checkbox-->
  217.                   <div class="form-check">
  218.                     <input class="form-check-input" id="2star" type="checkbox">
  219.                     <label class="form-check-label" for="2star"><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-secondary"></i><i class="fa-solid fa-star text-secondary"></i><i class="fa-solid fa-star text-secondary"></i></label>
  220.                   </div>
  221.                   <!-- Single Checkbox-->
  222.                   <div class="form-check">
  223.                     <input class="form-check-input" id="1star" type="checkbox">
  224.                     <label class="form-check-label" for="1star"><i class="fa-solid fa-star text-warning"></i><i class="fa-solid fa-star text-secondary"></i><i class="fa-solid fa-star text-secondary"></i><i class="fa-solid fa-star text-secondary"></i><i class="fa-solid fa-star text-secondary"></i></label>
  225.                   </div>
  226.                 </div>
  227.               </div>
  228.             </div>
  229.             <div class="col-12">
  230.               <!-- Payment Type-->
  231.               <div class="widget payment-type mb-4">
  232.                 <h6 class="widget-title mb-2">Payment Type</h6>
  233.                 <div class="widget-desc">
  234.                   <!-- Single Checkbox-->
  235.                   <div class="form-check">
  236.                     <input class="form-check-input" id="cod" type="checkbox" checked>
  237.                     <label class="form-check-label" for="cod">Cash On Delivery</label>
  238.                   </div>
  239.                   <!-- Single Checkbox-->
  240.                   <div class="form-check">
  241.                     <input class="form-check-input" id="paypal" type="checkbox">
  242.                     <label class="form-check-label" for="paypal">Paypal</label>
  243.                   </div>
  244.                   <!-- Single Checkbox-->
  245.                   <div class="form-check">
  246.                     <input class="form-check-input" id="checkpayment" type="checkbox">
  247.                     <label class="form-check-label" for="checkpayment">Check Payment</label>
  248.                   </div>
  249.                   <!-- Single Checkbox-->
  250.                   <div class="form-check">
  251.                     <input class="form-check-input" id="payonner" type="checkbox">
  252.                     <label class="form-check-label" for="payonner">Payonner</label>
  253.                   </div>
  254.                   <!-- Single Checkbox-->
  255.                   <div class="form-check">
  256.                     <input class="form-check-input" id="mobbanking" type="checkbox">
  257.                     <label class="form-check-label" for="mobbanking">Mobile Banking</label>
  258.                   </div>
  259.                 </div>
  260.               </div>
  261.             </div>
  262.             <div class="col-12">
  263.               <!-- Price Range-->
  264.               <div class="widget price-range mb-4">
  265.                 <h6 class="widget-title mb-2">Price Range</h6>
  266.                 <div class="widget-desc">
  267.                   <!-- Min Value-->
  268.                   <div class="row g-3">
  269.                     <div class="col-6">
  270.                       <div class="form-floating">
  271.                         <input class="form-control" id="floatingInput" type="text" placeholder="1" value="1">
  272.                         <label for="floatingInput">Min</label>
  273.                       </div>
  274.                     </div>
  275.                     <div class="col-6">
  276.                       <div class="form-floating">
  277.                         <input class="form-control" id="floatingInput" type="text" placeholder="1" value="5000">
  278.                         <label for="floatingInput">Max</label>
  279.                       </div>
  280.                     </div>
  281.                   </div>
  282.                 </div>
  283.               </div>
  284.             </div>
  285.             <div class="col-12">
  286.               <!-- Apply Filter-->
  287.               <div class="apply-filter-btn"><a class="btn btn-success w-100" href="#">Apply Filter</a></div>
  288.             </div>
  289.           </div>
  290.         </div>
  291.       </div>
  292.     </div>
  293.     <div class="page-content-wrapper">
  294.       <!-- Catagory Banner-->
  295.       <div class="hero-wrapper">
  296.         <div class="container">
  297.           <div class="pt-3">
  298.             <!-- Hero Slides-->
  299.             <div class="hero-slides  owl-carousel">
  300.               <!-- Single Hero Slide-->
  301.               <div class="single-hero-slide active" 
  302.                  style="background-image: url({{ asset('img/bg-img/1.jpg')  }})">
  303.                 <div class="slide-content h-100 d-flex align-items-center">
  304.                   <div class="slide-text">
  305.                     <h4 class="text-white mb-0" data-animation="fadeInUp" data-delay="1000ms" data-duration="1000ms">AidMarket</h4>
  306.                     <p class="text-white" data-animation="fadeInUp" data-delay="400ms" data-duration="1000ms">Retrouvez prêt de chez vous, <br>des boutiques, des restaurants, <br> des espaces chics  et des magasins... </p><a class="btn btn-primary" href="#" data-animation="fadeInUp" data-delay="800ms" data-duration="1000ms">En savoir plus</a>
  307.                   </div>
  308.                 </div>
  309.               </div>
  310.               <!-- Single Hero Slide-->
  311.               <div class="single-hero-slide" 
  312.               style="background-image: url({{ asset('img/bg-img/2.jpg')  }})">
  313.                 <div class="slide-content h-100 d-flex align-items-center">
  314.                   <div class="slide-text">
  315.                     <h4 class="text-white mb-0" data-animation="fadeInUp" data-delay="1000ms" data-duration="1000ms">AidMarket</h4>
  316.                     <p class="text-white" data-animation="fadeInUp" data-delay="400ms" data-duration="1000ms">Nous vous apportons une visibilité <br> avec une grande communauté</p><a class="btn btn-success" href="#" data-animation="fadeInUp" data-delay="500ms" data-duration="1000ms">En savoir plus</a>
  317.                   </div>
  318.                 </div>
  319.               </div>
  320.               <!-- Single Hero Slide-->
  321.               <div class="single-hero-slide" 
  322.                  style="background-image: url( {{ asset('img/bg-img/14.jpg') }})"
  323.                  >
  324.                 <div class="slide-content h-100 d-flex align-items-center">
  325.                   <div class="slide-text">
  326.                     <h4 class="text-white mb-0" data-animation="fadeInUp" data-delay="1000ms" data-duration="1000ms">AidMarket</h4>
  327.                     <p class="text-white" data-animation="fadeInUp" data-delay="400ms" data-duration="1000ms">Vendre plus, acheter plus, avec <br> notre communauté grandissante</p><a class="btn btn-danger" href="#" data-animation="fadeInUp" data-delay="800ms" data-duration="1000ms">En savoir plus</a>
  328.                   </div>
  329.                 </div>
  330.               </div>
  331.             </div>
  332.           </div>
  333.         </div>
  334.       </div>
  335.       
  337. <div class="top-products-area py-3">
  338.     <div class="container">
  339.       <div class="section-heading d-flex align-items-center justify-content-between dir-rtl">
  340.             <h6>Nos boutiques</h6>
  341.             <a class="btn p-0" href="#{}">Voir plus<i class="ms-1 fa-solid fa-arrow-right-long"></i></a>
  342.             <div class="layout-options">
  343.               <a href="{{ path('app_boutique_Boutiques') }}"><i class="fa-solid fa-border-all"></i></a>
  344.               <a  class="active" href="#"><i class="fa-solid fa-list-ul"></i></a>
  345.             </div>
  346.           </div>
  347.      <div class="page-content-wrapper py-3 mt-1">
  348.       <div class="container">
  349.         <div class="row gy-3">
  351.           {% for ListeUserVendeur in vendeurBoutiques %}
  353.           <div class="col-12">
  354.             <!-- Single Vendor -->
  355.             <div class="single-vendor-wrap bg-img p-4 bg-overlay" style="background-image: url({{ asset('img/bg-img/10.jpg')  }})">
  356.               <h5 class="vendor-title text-white">{{ ListeUserVendeur.nomBoutique }}</h5>
  357.               <div class="vendor-info">
  358.                 <p class="mb-1 text-white">
  359.                   <i class="fa-solid fa-location-dot me-1">
  360.                     
  361.                   </i>{{ ListeUserVendeur.geolocalisation }}</p>
  362.                 <div class="ratings lh-1">
  363.                   
  364.                   <span class="text-white">VUES : 986.08</span>
  365.                   <span class="text-white">SUIVI.ES : 986.08</span>
  366.                   <span class="text-white">FOLLOWING : 986.08</span>
  367.                 </div>
  368.               </div><a class="btn btn-warning btn-sm mt-3" href="{{ path('app_boutique_vendeur', {id: ListeUserVendeur.id}) }}">Voir la boutique<i class="fa-solid fa-arrow-right-long ms-1"></i></a>
  369.               <!-- Vendor Profile-->
  370.               <div class="vendor-profile shadow">
  371.                 <figure class="m-0"><img src="img/icon.jpg" alt=""></figure>
  372.               </div>
  373.             </div>
  374.           </div>
  375.           
  376.           {% endfor %}
  378.         </div>
  379.       </div>
  380.         
  381.     </div>
  382.    
  383.    <div class="row">
  384.      <a class="btn btn-info mt-1 " href="{{path('app_touteboutique')}}">Voir plus de boutique<i class="fa-solid fa-arrow-right-long ms-1"></i></a>
  385.    </div>
  386.     </div>
  387. </div>
  390.     </div>
  391.     <!-- Internet Connection Status-->
  392.     <div class="internet-connection-status" id="internetStatus"></div>
  393.     <!-- Footer Nav-->
  395.    {% include 'main/footer.html.twig' %}
  397.     {% if app.user and app.user.compte == 'client' %}
  399.       {% include 'main/footerparticulier.html.twig' %}
  401.     {% elseif app.user and app.user.compte == 'vendeur' %}
  403.     {% include 'main/footer.html.twig' %}
  405.     <a href="{{ path('app_ajouterProduit') }}">
  406.       <div data-js="back-top" class="back-top">
  407.       
  408.         <img src="img/plus.png" width="110px"  alt="">
  409.      </div>
  410.     </a>
  412.   {% else %}
  414.    
  416.   {% endif %}
  419.  {% endblock %}
  422.         {% block javascripts %}
  423.             {{ encore_entry_script_tags('app') }}
  426.         
  427.    <!-- All JavaScript Files-->
  428.     <script src="{{asset('js/bootstrap.bundle.min.js')}}"></script>
  429.     <script src="{{asset('js/jquery.min.js')}}"></script>
  430.     <script src="{{asset('js/waypoints.min.js')}}"></script>
  431.     <script src="{{asset('js/jquery.easing.min.js')}}"></script>
  432.     <script src="{{asset('js/owl.carousel.min.js')}}"></script>
  433.     <script src="{{asset('js/jquery.magnific-popup.min.js')}}"></script>
  434.     <script src="{{asset('js/jquery.counterup.min.js')}}"></script>
  435.     <script src="{{asset('js/jquery.countdown.min.js')}}"></script>
  436.     <script src="{{asset('js/jquery.passwordstrength.js')}}"></script>
  437.     <script src="{{asset('js/jquery.nice-select.min.js')}}"></script>
  438.     <script src="{{asset('js/theme-switching.js')}}"></script>
  439.     <script src="{{asset('js/no-internet.js')}}"></script>
  440.     <script src="{{asset('js/active.js')}}"></script>
  441.     <script src="{{asset('js/pwa.js')}}"></script>
  443.     
  445.     {% endblock %}
  446.   </body>
  448. </html>