templates/destinations/show.html.twig line 6

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  2. {% block title %}{% endblock %}
  4. {% block body %}
  6.     <div class="container-fluid  p-0" style="background-image: url('{{ asset('images/destinations/' ~ destination.image) }}'); 
  7.     background-repeat:no-repeat;background-size:cover; background-position:center; min-height:450px;margin-top:-20px;">
  8.         <div class="container pt-5">
  9.             <h1 class="text-white text-center head" style="margin-top:120px;">Bienvenue en {{destination.pays}}</h1>
  10.         </div>
  12.     </div>
  15.         
  16.     <div class="container-fluid bg-light">
  17.     
  18.     <div class="container py-3">
  21. </nav>
  22.         
  23.         
  24.         </div>
  25.     
  26.     
  27.     </div>
  28.     
  29.     <!------------------------------SECOND-BLOCK---------------------------->
  30.     <div class="container pt-5 mb-5">
  31.     <div class="row">
  32.         <div class="col-lg-9">
  33.         <h1>{{destination.pays}}</h1>
  34.             <p class="text-dark">{{destination.description | raw}}</p>
  35.         
  38.         <!----------------------------GALERIE-------------------------------------->
  41.         </div>
  42.         
  43.         <!------------------------sidebar---------------------------------------->
  44.         <div class="col-lg-3">
  45.             
  46.             <!---------bon a savoir -------------->
  47.             
  48.                     <h2 class="mt-5">Bon à savoir</h2>
  49.             
  50.             
  51.             
  52.             
  53.             <div class="row py-3 border-bottom">
  54.             
  55.                             <div class="col-md-6 font-weight-bold">Langue</div>
  57.                 <div class="col-md-6">{{destination.langue}}</div></div>
  58.                 
  59.             <div class="row py-3 border-bottom">    
  60.             
  61.             <div class="col-md-6 font-weight-bold">Visa </div>
  62.                 <div class="col-md-6">{{destination.visa}}</div>
  63.                 
  64.                     </div>
  65.                 
  66.             
  67.                 
  68.             <div class="row py-3 border-bottom">
  69.             
  70.                 <div class="col-md-6 font-weight-bold">Devise utilisée</div>
  71.                 <div class="col-md-6">{{destination.devise}}</div></div>
  72.             
  73.             
  74.             <div class="row py-3 border-bottom">
  75.             
  76.                 <div class="col-md-6 font-weight-bold"> Superficie (km2)</div>
  77.                 <div class="col-md-6">{{destination.superficie}} km2</div>
  78.             </div>
  79.             
  80.             
  81.             
  82.             
  83.         
  85.                             
  87.             
  89.         
  90.         </div>
  91.         
  92.         
  93.         
  94.         
  95.         </div>
  96.     
  97.     
  98.     
  99.     </div>
  100.     
  101.     <!--------------Les offres ---------------------------->
  102.     
  103.     <div class="container">
  104.     
  105.         <div class="title text-center mt-5 mb-5"> <h4 class="blue_darkColor">Découvrez nos offres de voyages relatives</h4></div>
  106.     
  107.         <div class="row">
  108.         
  109.         <div class="col-lg-4">
  110.                         <a href="destination.php">
  111.                     <div class="card text-center mb-5" >
  112.             <img src="images/lyon-sejour.jpg" alt="" style="height:250px; " class="zoom-in">
  113.             <div class="ban   text-white text-left" style=" width:100%;">
  114.                 <div class="price">1000 €</div>
  115.                     <div class="ml-1  text-center position-absolute " style="bottom:2px; left:2px; text-shadow:1px 2px #333;font-size:2rem;">
  116.                         Superbe voyage</div>
  117.                 
  118.                 <div class="pictos position-absolute float-right" style="top:2px;left:2px;"><i class="fas fa-plane"></i>  <i class="fas fa-bed"></i>  <i class="fas fa-map"></i></div>
  119.     </div>
  120.             </div>    
  121.                     </a>
  122.             </div>
  123.             
  124.             
  125. <div class="col-lg-4">
  126.             
  127.                                 <a href="destination.php">
  128.                     <div class="card text-center mb-5" >
  129.             <img src="images/lyon-sejour.jpg" alt="" style="height:250px; " class="zoom-in">
  130.             <div class="ban   text-white text-left" style=" width:100%;">
  131.                 <div class="price">1000 €</div>
  132.                     <div class="ml-1  text-center position-absolute " style="bottom:2px; left:2px; text-shadow:1px 2px #333;font-size:2rem;">
  133.                         Superbe voyage</div>
  134.                 
  135.                 <div class="pictos position-absolute float-right" style="top:2px;left:2px;"><i class="fas fa-plane"></i>  <i class="fas fa-bed"></i>  <i class="fas fa-map"></i></div>
  136.     </div>
  137.             </div>    
  138.                     </a>
  139.             
  140.             
  141.             </div>
  142.             
  143.             
  144. <div class="col-lg-4">
  145.                                 <a href="destination.php">
  146.                     <div class="card text-center mb-5" >
  147.             <img src="images/lyon-sejour.jpg" alt="" style="height:250px; " class="zoom-in">
  148.             <div class="ban   text-white text-left" style=" width:100%;">
  149.                 <div class="price">1000 €</div>
  150.                     <div class="ml-1  text-center position-absolute " style="bottom:2px; left:2px; text-shadow:1px 2px #333;font-size:2rem;">
  151.                         Superbe voyage</div>
  152.                 
  153.                 <div class="pictos position-absolute float-right" style="top:2px;left:2px;"><i class="fas fa-plane"></i>  <i class="fas fa-bed"></i>  <i class="fas fa-map"></i></div>
  154.     </div>
  155.             </div>    
  156.                     </a>
  157.             </div>
  158.             
  159.             
  160.             
  161.             
  162.             
  163.         
  164.         </div>
  165.     
  166.     </div>
  167.     
  168.             <!--------------------------------------------------Pourquoi nous choisir---------------------------------------------------------->
  169.     <div class="container-fluid bg-light mb-4" style="">
  170.   <div class="container pt-5">
  171.     <h3 class="text-center">Pourquoi nous choisir?</h3>
  172.     <div class="row mt-5">
  173.         
  174.              <div class="col-lg-3">
  175.         <div class="card  border-0" style="background:transparent !important;">
  176.           <div class="card-title text-center  rounded-circle"><span class="glyphicon  glyphicon-plane azurBlue border  border-warning p-4 rounded-circle" style="font-size:40px;"></span>
  178.           </div>
  179.           <div class="card-body  text-center " style="background:transparent !important;">
  180.              <h4 class="orangeColor">Les meilleurs Destinations </h4>
  181.             <p class="text-dark">On sait depuis longtemps que travailler avec du texte lisible et contenant. </p>
  182.           </div>
  183.         </div>
  184.       </div>
  185.         
  186.       <div class="col-lg-3">
  187.         <div class="card border-0 " style="background:transparent !important;">
  188.           <div class="card-title text-center  rounded-circle"><span class="glyphicon  glyphicon-bed azurBlue border  border-warning p-4 rounded-circle" style="font-size:40px;"></span>
  190.           </div>
  191.           <div class="card-body  text-center">
  192.              <h4 class="orangeColor" style="">les meilleurts séjours</h4>
  193.             <p class="text-dark">On sait depuis longtemps que travailler avec du texte lisible et contenant.</p>
  194.           </div>
  195.         </div>
  196.       </div>
  197.         
  198.    <div class="col-lg-3">
  199.         <div class="card border-0 " style="background:transparent !important;">
  200.           <div class="card-title text-center  rounded-circle"><span class="glyphicon   glyphicon-pencil azurBlue border  border-warning p-4 rounded-circle" style="font-size:40px;"></span>
  202.           </div>
  203.           <div class="card-body border-0  text-center">
  204.              <h4 class="orangeColor">Séjours Personalisables</h4>
  205.             <p class="text-dark">On sait depuis longtemps que travailler avec du texte lisible et contenant.</p>
  206.           </div>
  207.         </div>
  208.       </div>
  209.         
  210.         
  211.               <div class="col-lg-3">
  212.         <div class="card border-0 " style="background:transparent !important;">
  213.           <div class="card-title text-center  rounded-circle"><span class="glyphicon glyphicon-thumbs-up azurBlue border  border-warning p-4 rounded-circle" style="font-size:40px;"></span>
  215.           </div>
  216.           <div class="card-body text-center">
  217.              <h4 class="orangeColor">100% clients satisfaits</h4>
  218.             <p class="text-dark">On sait depuis longtemps que travailler avec du texte lisible et contenant.</p>
  219.           </div>
  220.         </div>
  221.       </div>
  222.         
  223.         
  224.     </div>
  225.   </div>
  226. </div>
  227.     
  228.     <!-----------------Gallerie---------------------------------->
  229. <div class="container mb-4">
  230.     <h2 class="text-center">Galerie</h2>
  231.             <div class="row">
  232.   <div class="col-md-12">
  234.     <div id="mdb-lightbox-ui"></div>
  236.     <div class="mdb-lightbox ">
  238.       <figure class="col-md-4 ">
  239.         <a href="https://mdbootstrap.com/img/Photos/Lightbox/Original/img%20(145).jpg" data-size="1600x1067">
  240.           <img alt="picture" src="https://mdbootstrap.com/img/Photos/Lightbox/Thumbnail/img%20(145).jpg" class="img-fluid ">
  241.         </a>
  242.       </figure>
  244.       <figure class="col-md-4">
  245.         <a href="https://mdbootstrap.com/img/Photos/Lightbox/Original/img%20(150).jpg" data-size="1600x1067">
  246.           <img alt="picture" src="https://mdbootstrap.com/img/Photos/Lightbox/Thumbnail/img%20(150).jpg" class="img-fluid" />
  247.         </a>
  248.       </figure>
  250.       <figure class="col-md-4">
  251.         <a href="https://mdbootstrap.com/img/Photos/Lightbox/Original/img%20(152).jpg" data-size="1600x1067">
  252.           <img alt="picture" src="https://mdbootstrap.com/img/Photos/Lightbox/Thumbnail/img%20(152).jpg" class="img-fluid" />
  253.         </a>
  254.       </figure>
  256.       <figure class="col-md-4">
  257.         <a href="https://mdbootstrap.com/img/Photos/Lightbox/Original/img%20(42).jpg" data-size="1600x1067">
  258.           <img alt="picture" src="https://mdbootstrap.com/img/Photos/Lightbox/Thumbnail/img%20(42).jpg" class="img-fluid" />
  259.         </a>
  260.       </figure>
  262.       <figure class="col-md-4">
  263.         <a href="https://mdbootstrap.com/img/Photos/Lightbox/Original/img%20(151).jpg" data-size="1600x1067">
  264.           <img alt="picture" src="https://mdbootstrap.com/img/Photos/Lightbox/Thumbnail/img%20(151).jpg" class="img-fluid" />
  265.         </a>
  266.       </figure>
  268.       <figure class="col-md-4">
  269.         <a href="https://mdbootstrap.com/img/Photos/Lightbox/Original/img%20(40).jpg" data-size="1600x1067">
  270.           <img alt="picture" src="https://mdbootstrap.com/img/Photos/Lightbox/Thumbnail/img%20(40).jpg" class="img-fluid" />
  271.         </a>
  272.       </figure>
  274.  
  276.     </div>
  278.   </div>
  279. </div>
  280.     
  281.     
  282.     </div>
  290. {% endblock %}