templates/client/touteboutique.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.         
  21.         {{ encore_entry_link_tags('app') }}
  22.         
  24.     <link rel="icon" href="{{asset('img/icons/icon-72x72.png')}}">
  25.     <!-- Apple Touch Icon -->
  26.     <link rel="apple-touch-icon" href="{{asset('img/icons/icon-96x96.png')}}">
  27.     <link rel="apple-touch-icon" sizes="152x152" href="{{asset('img/icons/icon-152x152.png')}}">
  28.     <link rel="apple-touch-icon" sizes="167x167" href="{{asset('img/icons/icon-167x167.png')}}">
  29.     <link rel="apple-touch-icon" sizes="180x180" href="{{asset('img/icons/icon-180x180.png')}}">
  30.     <!-- CSS Libraries -->
  31.     <link rel="stylesheet" href="{{asset('css/bootstrap.min.css')}}">
  32.     <link rel="stylesheet" href="{{asset('css/animate.css')}}">
  33.     <link rel="stylesheet" href="{{asset('css/all.min.css')}}">
  34.     <link rel="stylesheet" href="{{asset('css/brands.min.css')}}">
  35.     <link rel="stylesheet" href="{{asset('css/solid.min.css')}}">
  36.     <link rel="stylesheet" href="{{asset('css/owl.carousel.min.css')}}">
  37.     <link rel="stylesheet" href="{{asset('css/magnific-popup.css')}}">
  38.     <link rel="stylesheet" href="{{asset('css/nice-select.css')}}">
  39.     <!-- Stylesheet -->
  40.     <link rel="stylesheet" href="{{asset('css/style.css')}}">
  41.     <link rel="stylesheet" href="{{asset('css/card.css')}}">
  42.     <!-- Web App Manifest -->
  43.     <link rel="manifest" href="{{asset('js/manifest.json')}}">
  45.     {% endblock %}
  47.   </head>
  48.   <body>
  50.     {% block body %}
  52. <!-- Header Area-->
  53.     <div class="header-area" id="headerArea">
  54.       <div class="container h-100 d-flex align-items-center justify-content-between rtl-flex-d-row-r">
  55.         <!-- Back Button-->
  57.         {% if app.user and app.user.compte == 'client' %}
  59.         <div class="back-button me-2">
  60.           <a href="{{path('app_main_particulier')}}">
  61.           <i class="fa-solid fa-arrow-left-long"></i>
  62.          </a>
  63.        </div>
  65.        {% elseif app.user and app.user.compte == 'vendeur' %}
  67.         <div class="back-button me-2">
  68.           <a href="{{path('app_main')}}">
  69.           <i class="fa-solid fa-arrow-left-long"></i>
  70.          </a>
  71.        </div>
  73.        {% else %}
  75.       <div class="back-button me-2">
  76.         <a href="{{ path('app_main')}}"><i class="fa-solid fa-arrow-left-long"></i></a>
  77.       </div>
  79.       {% endif %}
  81.         <!-- Page Title-->
  82.         <div class="page-heading">
  83.           <h6 class="mb-0">Toutes les boutiques  </h6>
  84.         </div>
  85.         <!-- Filter Option
  86.         <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>-->
  88.         <div class="filter-option ms-2" data-bs-toggle="offcanvas"  aria-controls="suhaFilterOffcanvas"><i class="fa-solid fa-sliders"></i></div>
  90.       </div>
  91.     </div>
  92.     <div class="offcanvas offcanvas-start suha-filter-offcanvas-wrap" tabindex="-1" id="suhaFilterOffcanvas" aria-labelledby="suhaFilterOffcanvasLabel">
  93.       <!-- Close button-->
  94.       <button class="btn-close text-reset" type="button" data-bs-dismiss="offcanvas" aria-label="Close"></button>
  95.       <!-- Offcanvas body-->
  96.       <div class="offcanvas-body py-5">
  97.         <div class="container">
  98.           <div class="row">
  99.             <div class="col-12">
  100.               <!-- Catagory-->
  101.               <div class="widget catagory mb-4">
  102.                 <h6 class="widget-title mb-2">Brand</h6>
  103.                 <div class="widget-desc">
  104.                   <!-- Single Checkbox-->
  105.                   <div class="form-check">
  106.                     <input class="form-check-input" id="zara" type="checkbox" checked>
  107.                     <label class="form-check-label" for="zara">Zara</label>
  108.                   </div>
  109.                   <!-- Single Checkbox-->
  110.                   <div class="form-check">
  111.                     <input class="form-check-input" id="Gucci" type="checkbox">
  112.                     <label class="form-check-label" for="Gucci">Gucci</label>
  113.                   </div>
  114.                   <!-- Single Checkbox-->
  115.                   <div class="form-check">
  116.                     <input class="form-check-input" id="Addidas" type="checkbox">
  117.                     <label class="form-check-label" for="Addidas">Addidas</label>
  118.                   </div>
  119.                   <!-- Single Checkbox-->
  120.                   <div class="form-check">
  121.                     <input class="form-check-input" id="Nike" type="checkbox">
  122.                     <label class="form-check-label" for="Nike">Nike</label>
  123.                   </div>
  124.                   <!-- Single Checkbox-->
  125.                   <div class="form-check">
  126.                     <input class="form-check-input" id="Denim" type="checkbox">
  127.                     <label class="form-check-label" for="Denim">Denim</label>
  128.                   </div>
  129.                 </div>
  130.               </div>
  131.             </div>
  132.             <div class="col-12">
  133.               <!-- Color-->
  134.               <div class="widget color mb-4">
  135.                 <h6 class="widget-title mb-2">Color Family</h6>
  136.                 <div class="widget-desc">
  137.                   <!-- Single Checkbox-->
  138.                   <div class="form-check">
  139.                     <input class="form-check-input" id="Purple" type="checkbox" checked>
  140.                     <label class="form-check-label" for="Purple">Purple</label>
  141.                   </div>
  142.                   <!-- Single Checkbox-->
  143.                   <div class="form-check">
  144.                     <input class="form-check-input" id="Black" type="checkbox">
  145.                     <label class="form-check-label" for="Black">Black</label>
  146.                   </div>
  147.                   <!-- Single Checkbox-->
  148.                   <div class="form-check">
  149.                     <input class="form-check-input" id="White" type="checkbox">
  150.                     <label class="form-check-label" for="White">White</label>
  151.                   </div>
  152.                   <!-- Single Checkbox-->
  153.                   <div class="form-check">
  154.                     <input class="form-check-input" id="Red" type="checkbox">
  155.                     <label class="form-check-label" for="Red">Red</label>
  156.                   </div>
  157.                   <!-- Single Checkbox-->
  158.                   <div class="form-check">
  159.                     <input class="form-check-input" id="Pink" type="checkbox">
  160.                     <label class="form-check-label" for="Pink">Pink</label>
  161.                   </div>
  162.                 </div>
  163.               </div>
  164.             </div>
  165.             <div class="col-12">
  166.               <!-- Size-->
  167.               <div class="widget size mb-4">
  168.                 <h6 class="widget-title mb-2">Size</h6>
  169.                 <div class="widget-desc">
  170.                   <!-- Single Checkbox-->
  171.                   <div class="form-check">
  172.                     <input class="form-check-input" id="XtraLarge" type="checkbox" checked>
  173.                     <label class="form-check-label" for="XtraLarge">Xtra Large</label>
  174.                   </div>
  175.                   <!-- Single Checkbox-->
  176.                   <div class="form-check">
  177.                     <input class="form-check-input" id="Large" type="checkbox">
  178.                     <label class="form-check-label" for="Large">Large</label>
  179.                   </div>
  180.                   <!-- Single Checkbox-->
  181.                   <div class="form-check">
  182.                     <input class="form-check-input" id="medium" type="checkbox">
  183.                     <label class="form-check-label" for="medium">Medium</label>
  184.                   </div>
  185.                   <!-- Single Checkbox-->
  186.                   <div class="form-check">
  187.                     <input class="form-check-input" id="Small" type="checkbox">
  188.                     <label class="form-check-label" for="Small">Small</label>
  189.                   </div>
  190.                   <!-- Single Checkbox-->
  191.                   <div class="form-check">
  192.                     <input class="form-check-input" id="ExtraSmall" type="checkbox">
  193.                     <label class="form-check-label" for="ExtraSmall">Extra Small</label>
  194.                   </div>
  195.                 </div>
  196.               </div>
  197.             </div>
  198.             <div class="col-12">
  199.               <!-- Ratings-->
  200.               <div class="widget ratings mb-4">
  201.                 <h6 class="widget-title mb-2">Ratings</h6>
  202.                 <div class="widget-desc">
  203.                   <!-- Single Checkbox-->
  204.                   <div class="form-check">
  205.                     <input class="form-check-input" id="5star" type="checkbox" checked>
  206.                     <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>
  207.                   </div>
  208.                   <!-- Single Checkbox-->
  209.                   <div class="form-check">
  210.                     <input class="form-check-input" id="4star" type="checkbox">
  211.                     <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>
  212.                   </div>
  213.                   <!-- Single Checkbox-->
  214.                   <div class="form-check">
  215.                     <input class="form-check-input" id="3star" type="checkbox">
  216.                     <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>
  217.                   </div>
  218.                   <!-- Single Checkbox-->
  219.                   <div class="form-check">
  220.                     <input class="form-check-input" id="2star" type="checkbox">
  221.                     <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>
  222.                   </div>
  223.                   <!-- Single Checkbox-->
  224.                   <div class="form-check">
  225.                     <input class="form-check-input" id="1star" type="checkbox">
  226.                     <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>
  227.                   </div>
  228.                 </div>
  229.               </div>
  230.             </div>
  231.             <div class="col-12">
  232.               <!-- Payment Type-->
  233.               <div class="widget payment-type mb-4">
  234.                 <h6 class="widget-title mb-2">Payment Type</h6>
  235.                 <div class="widget-desc">
  236.                   <!-- Single Checkbox-->
  237.                   <div class="form-check">
  238.                     <input class="form-check-input" id="cod" type="checkbox" checked>
  239.                     <label class="form-check-label" for="cod">Cash On Delivery</label>
  240.                   </div>
  241.                   <!-- Single Checkbox-->
  242.                   <div class="form-check">
  243.                     <input class="form-check-input" id="paypal" type="checkbox">
  244.                     <label class="form-check-label" for="paypal">Paypal</label>
  245.                   </div>
  246.                   <!-- Single Checkbox-->
  247.                   <div class="form-check">
  248.                     <input class="form-check-input" id="checkpayment" type="checkbox">
  249.                     <label class="form-check-label" for="checkpayment">Check Payment</label>
  250.                   </div>
  251.                   <!-- Single Checkbox-->
  252.                   <div class="form-check">
  253.                     <input class="form-check-input" id="payonner" type="checkbox">
  254.                     <label class="form-check-label" for="payonner">Payonner</label>
  255.                   </div>
  256.                   <!-- Single Checkbox-->
  257.                   <div class="form-check">
  258.                     <input class="form-check-input" id="mobbanking" type="checkbox">
  259.                     <label class="form-check-label" for="mobbanking">Mobile Banking</label>
  260.                   </div>
  261.                 </div>
  262.               </div>
  263.             </div>
  264.             <div class="col-12">
  265.               <!-- Price Range-->
  266.               <div class="widget price-range mb-4">
  267.                 <h6 class="widget-title mb-2">Price Range</h6>
  268.                 <div class="widget-desc">
  269.                   <!-- Min Value-->
  270.                   <div class="row g-3">
  271.                     <div class="col-6">
  272.                       <div class="form-floating">
  273.                         <input class="form-control" id="floatingInput" type="text" placeholder="1" value="1">
  274.                         <label for="floatingInput">Min</label>
  275.                       </div>
  276.                     </div>
  277.                     <div class="col-6">
  278.                       <div class="form-floating">
  279.                         <input class="form-control" id="floatingInput" type="text" placeholder="1" value="5000">
  280.                         <label for="floatingInput">Max</label>
  281.                       </div>
  282.                     </div>
  283.                   </div>
  284.                 </div>
  285.               </div>
  286.             </div>
  287.             <div class="col-12">
  288.               <!-- Apply Filter-->
  289.               <div class="apply-filter-btn"><a class="btn btn-success w-100" href="#">Apply Filter</a></div>
  290.             </div>
  291.           </div>
  292.         </div>
  293.       </div>
  294.     </div>
  295.     <div class="page-content-wrapper">
  296.       <div class="py-3">
  297.         <div class="container">
  298.           <div class="row g-1 align-items-center rtl-flex-d-row-r">
  299.             <div class="col-8">
  300.               <!-- Product Catagories Slide -->
  301.               <div class="product-catagories owl-carousel catagory-slides">
  302.                 <a class="shadow-sm" href="#">
  303.                   <img src="img/product/5.png" alt="">Boutiques</a>
  304.                   <a class="shadow-sm" href="#"><img src="img/product/9.png" alt="">Magasins</a>
  305.                   <a class="shadow-sm" href="#"><img src="img/product/4.png" alt="">Esthétiques</a>
  306.                   <a class="shadow-sm" href="#"><img src="img/product/9.png" alt="">Beautés</a>
  307.                   <a class="shadow-sm" href="#"><img src="img/product/4.png" alt="">Prestataires</a>
  308.                 </div>
  309.             </div>
  311.             <!-- menu en haut à droite pour afficher les produits par catégorie -->
  313.           <!-- Select Product Catagory-->
  315.             <!--<div class="col-4">
  316.               <div class="select-product-catagory">
  317.                 <select class="right small border-0" id="selectProductCatagory" name="selectProductCatagory" aria-label="Default select example">
  318.                   <option selected>afficher par</option>
  319.                   <option value="1">Newest</option>
  320.                   <option value="2">Popular</option>
  321.                   <option value="3">Ratings</option>
  322.                 </select>
  323.               </div>
  324.             </div>-->
  327.           </div>
  328.           <div class="mb-3"></div>
  330.  <div class="row g-2 rtl-flex-d-row-r">
  332. <!-- Product Card -->
  333.  {% for ListeUserVendeur in UserVendeur %}
  335. <div class="col-6 col-md-4">
  336.               <!-- code start -->
  337. <div class="profile-area">
  338. <div class="twPc-div ">
  339.     <a class="twPc-bg twPc-block"></a>
  341.   <div>
  342.     <div class="twPc-button">
  343.             <!-- Twitter Button | you can get from: https://about.twitter.com/tr/resources/buttons#follow -->
  345.         <a href="#" class="btn btn-info rounded " data-show-count="false" data-size="large" data-show-screen-name="false" data-dnt="true" data-bs-toggle="modal" data-bs-target="#myModaler">
  346.         <span class="bx bx-like">Suivre </span> 
  347.         </a>
  348.                 <!-- Twitter Button -->   
  349.     </div>
  351.     <a title="page boutique" href="#" class="twPc-avatarLink">
  352.       <img alt="Mert S. Kaplan" width="50px" src="img/icon.jpg" class="twPc-avatarImg">
  353.     </a>
  355.     <div class="twPc-divUser">
  356.       <div class="twPc-divName">
  357.         <a href="{{ path('app_boutique_vendeur', {id: ListeUserVendeur.id}) }}">
  358.           {{ ListeUserVendeur.nomBoutique }}</a>
  359.       </div>
  360.       
  361.     </div>
  363.     <div class="twPc-divStats">
  364.       <ul class="twPc-Arrange">
  365.         <li class="twPc-ArrangeSizeFit">
  366.           <a href="#" title="9.840 Tweet">
  367.             <span class="twPc-StatLabel twPc-block">Vues</span>
  368.             <span class="twPc-StatValue ">- </span>
  369.           </a>
  370.         </li>
  371.         <li class="twPc-ArrangeSizeFit">
  372.           <a href="#" title="885 Following">
  373.             <span class="twPc-StatLabel twPc-block">Suivi.es</span>
  374.             <span class="twPc-StatValue text-center"> - </span>
  375.           </a>
  376.         </li>
  377.         <li class="twPc-ArrangeSizeFit">
  378.           <a href="#" title="1.810 Followers">
  379.             <span class="twPc-StatLabel twPc-block">Following</span>
  380.             <span class="twPc-StatValue text-center"> - </span>
  381.           </a>
  382.         </li>
  383.       </ul>
  384.     </div>
  385.   </div>
  386. </div>
  387. </div>
  388. <!-- code end -->
  389. </div>
  391. {% endfor %}
  394. </div>
  396. <div class="modal" id="myModaler">
  397.   <div class="modal-dialog modal-dialog-centered">
  398.     <div class="modal-content">
  400.       <!-- Modal Header -->
  401.       <div class="modal-header">
  402.         <h4 class="modal-title">Veuillez créer un compte</h4>
  403.         <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
  404.       </div>
  406.       <!-- Modal body -->
  407.       <div class="modal-body">
  408.         <a href="{{ path('app_particulier') }}" class="btn btn-primary"> Compte particulier</a>
  409.         <a href="{{ path('app_auth') }}" class="btn btn-primary"> Compte Etablissement</a>
  410.       </div>
  412.       <!-- Modal footer -->
  413.       <div class="modal-footer">
  414.         <button type="button" class="btn btn-danger" data-bs-dismiss="modal">Close</button>
  415.       </div>
  417.     </div>
  418.   </div>
  419. </div>
  422.         </div>
  423.       </div>
  424.     </div>
  425.     <!-- Internet Connection Status-->
  426.     <div class="internet-connection-status" id="internetStatus"></div>
  427.     <!-- Footer Nav-->
  428.     
  429.     {% include 'main/footer.html.twig' %}
  430.     
  431.     {% if app.user and app.user.compte == 'client' %}
  433.       {% include 'main/footerparticulier.html.twig' %}
  435.     {% elseif app.user and app.user.compte == 'vendeur' %}
  437.     {% include 'main/footer.html.twig' %}
  439.     <a href="{{ path('app_ajouterProduit') }}">
  440.       <div data-js="back-top" class="back-top">
  441.       
  442.         <img src="img/plus.png" width="110px"  alt="">
  443.      </div>
  444.     </a>
  446.   {% else %}
  448.    
  450.   {% endif %}
  451.     
  453. {% endblock %}
  456.         {% block javascripts %}
  457.             {{ encore_entry_script_tags('app') }}
  458.         
  459.     <!-- All JavaScript Files-->
  460.     <script src="{{asset('js/bootstrap.bundle.min.js')}}"></script>
  461.     <script src="{{asset('js/jquery.min.js')}}"></script>
  462.     <script src="{{asset('js/waypoints.min.js')}}"></script>
  463.     <script src="{{asset('js/jquery.easing.min.js')}}"></script>
  464.     <script src="{{asset('js/owl.carousel.min.js')}}"></script>
  465.     <script src="{{asset('js/jquery.magnific-popup.min.js')}}"></script>
  466.     <script src="{{asset('js/jquery.counterup.min.js')}}"></script>
  467.     <script src="{{asset('js/jquery.countdown.min.js')}}"></script>
  468.     <script src="{{asset('js/jquery.passwordstrength.js')}}"></script>
  469.     <script src="{{asset('js/jquery.nice-select.min.js')}}"></script>
  470.     <script src="{{asset('js/theme-switching.js')}}"></script>
  471.     <script src="{{asset('js/no-internet.js')}}"></script>
  472.     <script src="{{asset('js/active.js')}}"></script>
  473.     <script src="{{asset('js/pwa.js')}}"></script>
  475.     {% endblock %}
  476.   </body>
  477. </html>