templates/product/show.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}{{ product.name }}{% endblock %}
  5. {% block body %}
  6. <!-- Navbar Start -->
  7.     <div class="container-fluid position-relative p-0">
  8.        <div class="container-fluid bg-primary py-5 bg-header" style="margin-bottom: 90px;">
  9.             <div class="row py-5">
  10.                 <div class="col-12 pt-lg-5 mt-lg-5 text-center">
  11.                     <h1 class="display-4 text-white animated zoomIn">Détail du produit</h1>
  12.                     <a href="{{ path('home') }}" class="h5 text-white">Accueil</a>
  13.                     <i class="far fa-circle text-white px-2"></i>
  14.                     <a href="" class="h5 text-white">Détail du produit</a>
  15.                 </div>
  16.             </div>
  17.         </div>
  18.     </div>
  19. <!-- Navbar End -->
  21. <!-- Shop Detail Start -->
  22. <div class="container-fluid py-5">
  23.     <div class="row px-xl-5">
  24.         <div class="col-lg-5 pb-5">
  25.             <div id="product-carousel" class="carousel slide" data-ride="carousel">
  26.                 <div class="carousel-inner border">
  27.                     <div class="carousel-item active">
  28.                         <img class="w-100 h-100" src="/uploads/{{product.image}}" alt="{{product.name}}" alt="Image">
  29.                     </div>
  30.                 </div>
  31.             </div>
  32.         </div>
  34.         <div class="col-lg-7 pb-5">
  35.             <h3 class="font-weight-semi-bold">{{product.name}}</h3>
  36.             
  37.             <h3 class="font-weight-semi-bold mb-4">{{(product.price / 100 )|number_format(2,',', '.')}} Fr CFA</h3>
  38.             <p class="mb-4">{{product.subtitle}}</p>
  39.             <div class="d-flex align-items-center mb-4 pt-2">
  40.                 <button class="btn btn-primary px-3"><i class="fa fa-shopping-cart mr-1"> <a href="{{ path('add_to_cart', {id: product.id}) }}" class="btn btn-sm text-dark p-0">Ajouter au panier </a></i></button>
  41.             </div>  
  42.             <div class="d-flex pt-2">
  43.                 <p class="text-dark font-weight-medium mb-0 mr-2">Partager avec:</p>
  44.                 <div class="d-inline-flex">
  45.                     <a class="text-dark px-2" href="">
  46.                         <i class="fab fa-facebook-f"></i>
  47.                     </a>
  48.                     <a class="text-dark px-2" href="">
  49.                         <i class="fab fa-twitter"></i>
  50.                     </a>
  51.                     <a class="text-dark px-2" href="">
  52.                         <i class="fab fa-linkedin-in"></i>
  53.                     </a>
  54.                     <a class="text-dark px-2" href="">
  55.                         <i class="fab fa-pinterest"></i>
  56.                     </a>
  57.                 </div>
  58.             </div>
  59.         </div>
  60.     </div>
  61.     <div class="row px-xl-5">
  62.         <div class="col">
  63.             <div class="nav nav-tabs justify-content-center border-secondary mb-4">
  64.                 <a class="nav-item nav-link active" data-toggle="tab" href="#tab-pane-1">Description</a>
  66.             </div>
  67.             <div class="tab-content">
  68.                 <div class="tab-pane fade show active" id="tab-pane-1">
  69.                     <h4 class="mb-3">Description du produit</h4>
  70.                     <p class="mb-4">{{product.description}}</p>
  71.                 </div>
  72.             </div>
  73.         </div>
  74.     </div>
  75. </div>
  76. <!-- Shop Detail End -->
  77.     
  78. {% endblock %}