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