templates/croisiere/details.html.twig line 1

Open in your IDE?
  1. {# {% extends 'base.html.twig' %}
  3. {% block title %}Détails de la Croisière{% endblock %}
  5. {% block body %}
  6.     <h1>Détails de la Croisière : {{ croisiere.name }}</h1>
  8.     <h2>Informations sur la croisière</h2>
  9.     <p><strong>Nom :</strong> {{ croisiere.name }}</p>
  12.     <h2>Sous-Croisières</h2>
  14.     <form method="post" action="{{ path('details', {'croisiereId': croisiere.id}) }}">
  15.         <!-- Sélection du nom de la croisière -->
  16. <select id="croisiereNom" name="croisiere_nom" style="margin-bottom: 10px; color: #9a9a9a; height: 42px; border-radius: 5px; width: 100%; box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5),7px 7px 20px 0px rgba(0,0,0,.1),4px 4px 5px 0px rgba(0,0,0,.1);">
  17.     <option value="" {% if not croisiereNom %}selected{% endif %}><span>Sélectionner une croisière</span></option>
  18.     {% for croisiere in croisieres %}
  19.     <option value="{{ croisiere.name }}" {% if croisiereNom == croisiere.name %}selected{% endif %}>
  20.         {{ croisiere.name }}
  21.     </option>
  22.     {% endfor %}
  23. </select>
  25. <!-- Sélection du titre du navire -->
  26. <select id="navireTitre" name="navire_titre" style="color: #9a9a9a; height: 42px; border-radius: 5px; width: 100%; box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5),7px 7px 20px 0px rgba(0,0,0,.1),4px 4px 5px 0px rgba(0,0,0,.1);">
  27.     <option value="" {% if not navireTitre %}selected{% endif %}><span>Sélectionner un navire</span></option>
  28.     {% for navire in navires %}
  29.     <option value="{{ navire.titre }}" {% if navireTitre == navire.titre %}selected{% endif %}>
  30.         {{ navire.titre }}
  31.     </option>
  32.     {% endfor %}
  33. </select>
  35. <!-- Sélection du nom de la sous-croisière -->
  36. <select id="sousCroisiereName" name="name" style="margin-left: 10px; color: #9a9a9a; height: 42px; border-radius: 5px; width: 100%; box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5),7px 7px 20px 0px rgba(0,0,0,.1),4px 4px 5px 0px rgba(0,0,0,.1);">
  37.     <option value="" {% if not name %}selected{% endif %}><span>Sélectionner une sous-croisière</span></option>
  38.     {% for sousCroisiere in sousCroisieres %}
  39.     <option value="{{ sousCroisiere.name }}" {% if name == sousCroisiere.name %}selected{% endif %}>
  40.         {{ sousCroisiere.name }}
  41.     </option>
  42.     {% endfor %}
  43. </select>
  46.         <button type="submit">Rechercher</button>
  47.     </form>
  49.     {% if sousCroisieres is not empty %}
  50.         <ul>
  51.             {% for sousCroisiere in sousCroisieres %}
  52.                 <li>
  53.                     <p><strong>Navire :</strong> {{ sousCroisiere.croisiere.name }}</p>
  54.                     <h3>{{ sousCroisiere.name }}</h3>
  55.                     <p><strong>Navire :</strong> {{ sousCroisiere.navire.titre }}</p>
  57.                     <p><strong>Durée :</strong> {{ sousCroisiere.duree }} jours</p>
  58.                 </li>
  59.             {% endfor %}
  60.         </ul>
  61.     {% else %}
  62.         <p>Aucune sous-croisière trouvée.</p>
  63.     {% endif %}
  66. {% endblock %} #}
  70. {% extends 'base.html.twig' %}
  72. {% block stylesheets %}
  73. {#    Ajoutez les liens vers les fichiers CSS de noUiSlider#}
  74.     <link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,800,900" rel="stylesheet">
  75.     <link rel="stylesheet" href="{{ asset('slider/css/owl.carousel.min.css') }}">
  76.     <link rel="stylesheet" href="{{ asset('slider/css/owl.theme.default.min.css') }}">
  77.     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/4.5.6/css/ionicons.min.css">
  78.     <link rel="stylesheet" href="{{ asset('slider/css/style.css') }}">
  79.     <link href="{{ asset('formcroisiere/css/main.css') }}" rel="stylesheet" />
  81.     <style>
  82.         .mt-100{
  83.             margin-top:100px;
  84.         }
  85.         .carousel .carousel-indicators li{
  86.             display:inline-block;
  87.             width:10px;
  88.             height:10px;
  89.             text-indent: -99px;
  90.             cursor:pointer;
  91.             border:1px solid #000;
  92.             background:#000;
  93.             border-radius:2px;
  94.         }
  96.         .sidebar_list {
  97.             margin-top: 10px;
  98.         }
  99.         .sidebar_archives {
  100.             margin-top: 40px;
  101.             margin-left: 70px;
  102.             margin-right: 40px;
  103.         }
  104.         .badge{
  105.             font-size: 84%;
  106.             height: 26px;
  107.             line-height: normal;
  108.             font-weight: 600;
  109.             background-color: #b29b63;
  110.         }
  112.         @media screen and (max-width: 768px) {
  113.             .offers_item{
  114.                 width: 130% !important;
  116.             }
  117.         }
  121.         .offers_item{
  122.             position: relative;
  123.             width: 205%;
  124.             margin-left: -50px;
  125.             overflow: hidden;
  126.             box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  127.             transition: all 300ms;
  128.             margin-top: 50px;
  129.             border-radius: 20px;
  130.             color: rgba(0, 0, 0, 0.87);
  131.             background: #fff;
  132.         }
  133.         .offer_item{
  134.             position: relative;
  135.             width: 205%;
  136.             overflow: hidden;
  137.             transition: all 300ms;
  138.             margin-top: 50px;
  139.             border-radius: 5px;
  140.             color: rgba(0, 0, 0, 0.87);
  141.             background:#1269a2
  142.         }
  143.         .offers_price {
  144.             display: inline-block;
  145.             font-size: 36px;
  146.             font-weight: 700;
  147.             color: #ff9100;
  148.             line-height: 25px;
  149.         }
  150.         .offers_price a{
  151.             display: inline-block;
  152.             font-size: 22px;
  153.             font-weight: 700;
  154.             color: #0093a9;
  155.             line-height: 25px;
  156.         }
  157.         .offer_name{
  158.             display: block;
  159.             font-size: 22px;
  160.             font-weight: 700;
  161.             background: #0093a9;
  162.             color: #FFFFFF;
  163.             width: 360px;
  164.             line-height: 35px;
  165.             padding-left: 12px;
  166.         }
  167.         .noUi-horizontal .noUi-tooltip{
  168.             bottom: -41px;
  169.         }
  172.         .offers_item:hover {
  173.             transform: translateY(-2px);
  174.             box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
  175.         }
  177.         .offers_image_background {
  178.             position: relative;
  179.             margin: auto;
  180.             overflow: hidden;
  181.         }
  182.         .offers_image_background img {
  183.             max-width: 100%;
  184.             transition: all 0.3s;
  185.             display: block;
  186.             transform: scale(1);
  187.         }
  189.         .offers_image_background:hover img {
  190.             transform: scale(1.1);
  191.         }
  192.         .container {
  193.             max-width: 1440px!important;
  194.         }
  195.         .offers_content {
  196.             margin-top: 65px;
  197.             margin-left: 17px;
  198.             margin-bottom: 22px;
  199.             margin-right: 17px;
  200.         }
  202.         .offers_link {
  203.             margin-top: 24px;
  204.         }
  205.         .offers_link a {
  206.             font-size: 14px;
  207.             font-weight: 700;
  208.             color: #2d2c2c;
  209.             text-transform: uppercase;
  210.             -webkit-transition: all 200ms ease;
  211.             -moz-transition: all 200ms ease;
  212.             -ms-transition: all 200ms ease;
  213.             -o-transition: all 200ms ease;
  214.             transition: all 200ms ease;
  215.         }
  216.         .badge{
  217.             font-size: 78%;
  218.             font-weight: 600;
  219.             background-color: #b29b63;
  220.         }
  221.         .badges
  222.         {
  223.             border: 1px solid white;
  224.             background: white;
  225.             color: #ff9600;
  226.             width: 100%;
  227.             height: 50px;
  228.         }
  229.         .work-wrap .img
  230.         {
  231.             height: auto;
  232.             width: auto;
  233.         }
  234.         @media (min-width: 992px) {
  235.             .owl-carousel .owl-dots {
  236.                 position: absolute;
  237.                 top: 0;
  238.                 right: 50px!important;
  239.                 margin-top: 0;
  240.                 margin-right: -40px; }
  241.             .owl-carousel .owl-dots .owl-dot {
  242.                 display: block; }
  245.         }
  247.         @media screen and (max-width: 768px)
  248.         {
  249.             .offer_item {
  250.                 margin-left: 30px !important;
  251.                 width: 85% !important;
  252.             }
  254.             
  255.             .critere{
  256.                     margin-left: 0px!important;
  257.                     margin-bottom: 10px!important;
  258.                     color: #9a9a9a!important;
  259.                     height: 42px!important;
  260.                     border-radius: 5px!important;
  261.                     width: 90%!important;
  262.                     box-shadow: inset 2px 2px 2px 0px rgba(255, 255, 255, .5), 7px 7px 20px 0px rgba(0, 0, 0, .1), 4px 4px 5px 0px rgba(0, 0, 0, .1)!important;
  263.             }
  264.             .btn-4{
  265.                 margin-left: -11px!important;
  266.                 width: 39%!important;
  267.             }
  268.             
  269.         
  270.             .btn-3
  271.             {
  272.                 background: #ff9600;
  273.                 width: 200px;
  274.                 height: 50px;
  275.                 line-height: 52px;
  276.                 margin-left: 65px!important;
  277.                 padding: 0;
  278.                 border: none;
  279.                 border-radius: 5px;
  280.             }
  281.             .btn-3 span {
  282.                 position: relative;
  283.                 display: block;
  284.                 width: 100%;
  285.                 height: 100%;
  286.                 background:#ff9600;
  287.             }
  288.             .offers_price1
  289.             {
  290.                 margin-top:-50px!important;
  291.                 margin-left:63px!important;
  292.             }
  294.         }
  295.         .owl-carousel .owl-dots
  296.         {
  297.             text-align: justify;
  298.             margin-top: 0px;
  299.         }
  300.         .owl-carousel .owl-nav {
  301.             position: absolute;
  302.             bottom: 0;
  303.             left: 0;
  304.             right: 0;
  305.             display: none;
  306.         }
  307.         .ftco-section
  308.         {
  309.             padding: 5em 0;
  310.             margin-top: -35px;
  311.         }
  313.         button {
  314.             margin: 20px;
  315.         }
  316.         .custom-btn {
  317.             width: 130px;
  318.             height: 40px;
  319.             color: #fff;
  320.             border-radius: 5px;
  321.             padding: 10px 25px;
  322.             font-family: 'Lato', sans-serif;
  323.             font-weight: 500;
  324.             background: transparent;
  325.             cursor: pointer;
  326.             transition: all 0.3s ease;
  327.             position: relative;
  328.             display: inline-block;
  329.             box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5),
  330.             7px 7px 20px 0px rgba(0,0,0,.1),
  331.             4px 4px 5px 0px rgba(0,0,0,.1);
  332.             outline: none;
  333.         }
  334.         /* 3 */
  335.         .btn-4 {
  336.             background: #0093a9;
  337.             width: 41%;
  338.             height: 42px;
  339.             margin-top: 0px;
  340.             line-height: 44px;
  341.             margin-left: 0px;
  342.             padding: 0;
  343.             border: none;
  344.             border-radius: 5px;
  345.         }
  346.         .btn-4 span {
  347.             position: relative;
  348.             display: block;
  349.             width: 100%;
  350.             height: 100%;
  351.         }
  352.         .btn-4:before,
  353.         .btn-4:after {
  354.             position: absolute;
  355.             content: "";
  356.             right: 0;
  357.             top: 0;
  358.             background: #ff9600;
  359.             border-radius: 5px;
  360.             transition: all 0.3s ease;
  361.         }
  362.         .btn-4:before {
  363.             height: 0%;
  364.             width: 2px;
  365.         }
  366.         .btn-4:after {
  367.             width: 0%;
  368.             height: 2px;
  369.         }
  370.         .btn-4 span:before,
  371.         .btn-4 span:after {
  372.             position: absolute;
  373.             content: "";
  374.             left: 0;
  375.             bottom: 0;
  376.             background: #ff9600;
  377.             border-radius: 5px;
  378.             transition: all 0.3s ease;
  379.         }
  380.         .btn-4 span:before {
  381.             width: 2px;
  382.             height: 0%;
  383.         }
  384.         .btn-4 span:after {
  385.             width: 0%;
  386.             height: 2px;
  387.         }
  388.         .form-search{
  389.             width: 100%;
  390.             margin-left: 20px;
  391.             margin-top: 16px;
  392.         }
  393.         .btn-3 {
  394.             background: #ff9600;
  395.             width: 200px;
  396.             height: 50px;
  397.             line-height: 52px;
  398.             margin-left: 0px;
  399.             padding: 0;
  400.             border: none;
  401.             border-radius: 5px;
  402.         }
  403.         .btn-3 span {
  404.             position: relative;
  405.             display: block;
  406.             width: 100%;
  407.             height: 100%;
  408.         }
  409.         .btn-3:before,
  410.         .btn-3:after {
  411.             position: absolute;
  412.             content: "";
  413.             right: 0;
  414.             top: 0;
  415.             background: #ff9600;
  416.             border-radius: 5px;
  417.             transition: all 0.3s ease;
  418.         }
  419.         .btn-3:before {
  420.             height: 0%;
  421.             width: 2px;
  422.         }
  423.         .btn-3:after {
  424.             width: 0%;
  425.             height: 2px;
  426.         }
  427.         .btn-3 span:before,
  428.         .btn-3 span:after {
  429.             position: absolute;
  430.             content: "";
  431.             left: 0;
  432.             bottom: 0;
  433.             background: #ff9600;
  434.             border-radius: 5px;
  435.             transition: all 0.3s ease;
  436.         }
  437.         .btn-3 span:before {
  438.             width: 2px;
  439.             height: 0%;
  440.         }
  441.         .btn-3 span:after {
  442.             width: 0%;
  443.             height: 2px;
  444.         }
  446.         .btn-5 {
  447.             background: #0093a9;
  448.             width: 41%;
  449.             height: 42px;
  450.             margin-top: 0px;
  451.             line-height: 44px;
  452.             margin-left: 0px;
  453.             padding: 0;
  454.             border: none;
  455.             border-radius: 5px;
  456.         }
  457.         .btn-5 span {
  458.             position: relative;
  459.             display: block;
  460.             width: 100%;
  461.             height: 100%;
  462.         }
  463.         .btn-5:before,
  464.         .btn-5:after {
  465.             position: absolute;
  466.             content: "";
  467.             right: 0;
  468.             top: 0;
  469.             background: #ff9600;
  470.             border-radius: 5px;
  471.             transition: all 0.3s ease;
  472.         }
  473.         .btn-5:before {
  474.             height: 0%;
  475.             width: 2px;
  476.         }
  477.         .btn-5:after {
  478.             width: 0%;
  479.             height: 2px;
  480.         }
  481.         .btn-5 span:before,
  482.         .btn-5 span:after {
  483.             position: absolute;
  484.             content: "";
  485.             left: 0;
  486.             bottom: 0;
  487.             background: #ff9600;
  488.             border-radius: 5px;
  489.             transition: all 0.3s ease;
  490.         }
  491.         .btn-5 span:before {
  492.             width: 2px;
  493.             height: 0%;
  494.         }
  495.         .btn-5 span:after {
  496.             width: 0%;
  497.             height: 2px;
  498.         }
  499.     </style>
  501. {% endblock %}
  502. {% block body %}
  503.     <div class="home" style="height: 150px;background: #fafafa"></div>
  504.     <div class="row" style="background: #fafafa">
  505.         <div class="offer_item" style="margin-left: 125px;width: 78.8%">
  506.             <form method="post" action="{{ path('details', {'croisiereId': croisiere.id}) }}" class="form-search">
  507.                 <div class="row">
  508.                     <div class="col-md-4">
  509.                         <!-- Sélection du nom de la croisière -->
  510.                         <select class="critere" id="croisiereNom" name="croisiere_nom" style="margin-bottom: 10px; color: #9a9a9a; height: 42px; border-radius: 5px; width: 90%; box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5),7px 7px 20px 0px rgba(0,0,0,.1),4px 4px 5px 0px rgba(0,0,0,.1);">
  511.                             <option value="" {% if not croisiereNom %}selected{% endif %}><span>Destinations</span></option>
  512.                             {% for croisiere in croisieres %}
  513.                                 <option value="{{ croisiere.name }}" {% if croisiereNom == croisiere.name %}selected{% endif %}>
  514.                                     {{ croisiere.name }}
  515.                                 </option>
  516.                             {% endfor %}
  517.                         </select>
  518.                     </div>
  519.                     <div class="col-md-4">
  520.                         <select class="critere" name="monthYear" id="monthYear" style="margin-left: 10px; color: #9a9a9a; height: 42px; border-radius: 5px; width: 90%; box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5),7px 7px 20px 0px rgba(0,0,0,.1),4px 4px 5px 0px rgba(0,0,0,.1);">
  521.                             <option placeholder="" value="" {% if not dated %}selected{% endif %}>Dates de départ</option>
  522.                             {% set months = ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre'] %}
  524.                             Déterminer le mois et l'année actuels
  525.                             {% set now = "now"|date("Y-m-d") %}
  526.                             {% set currentMonth = now|date("n") %}
  527.                             {% set currentYear = now|date("Y") %}
  529.                             Spécifiez la plage d'années à afficher
  530.                             {% set startYear = currentYear %}
  531.                             {% set endYear = 2026 %}
  532.                             Afficher les mois et années à partir du mois et année actuels
  533.                             {% for year in startYear..endYear %}
  534.                                 {% set startMonth = (year == currentYear) ? currentMonth : 1 %}
  535.                                 {% for i in startMonth..12 %}
  536.                                     <option value="{{ i ~ '-' ~ year }}"
  537.                                             {% if monthYear == (i ~ '-' ~ year) %}
  538.                                     selected
  539.                                             {% endif %}>
  540.                                         {{ months[i-1] }} {{ year }}
  541.                                     </option>
  542.                                 {% endfor %}
  543.                             {% endfor %}
  544.                         </select>
  545.                     </div>
  546.                     <div class="col-md-4">
  547.                         <select class="critere" id="sousCroisiereDestination" name="destination" style="margin-left: 10px; color: #9a9a9a; height: 42px; border-radius: 5px; width: 90%; box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5),7px 7px 20px 0px rgba(0,0,0,.1),4px 4px 5px 0px rgba(0,0,0,.1);">
  548.                             <option placeholder="" value="" {% if not destination %}selected{% endif %}><span>Ports de départ</span></option>
  549.                             {% for sousCroisiere in sousCroisieres %}
  550.                                 <option value="{{ sousCroisiere.destination }}" {% if name == sousCroisiere.destination %}selected{% endif %}>
  551.                                     {{ sousCroisiere.destination|split(',')[0] }}
  552.                                 </option>
  553.                             {% endfor %}
  554.                         </select>
  555.                     </div>
  556.                 </div>
  557.                 <div class="row">
  558.                     <div class="col-md-4">
  559.                         <!-- Sélection du titre du navire -->
  560.                         <select class="critere" id="navireTitre" name="navire_titre" style="color: #9a9a9a; height: 42px; border-radius: 5px; width: 90%; box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5),7px 7px 20px 0px rgba(0,0,0,.1),4px 4px 5px 0px rgba(0,0,0,.1);">
  561.                             <option value="" {% if not navireTitre %}selected{% endif %}><span>Navires</span></option>
  562.                             {% for navire in navires %}
  563.                                 <option value="{{ navire.titre }}" {% if navireTitre == navire.titre %}selected{% endif %}>
  564.                                     {{ navire.titre }}
  565.                                 </option>
  566.                             {% endfor %}
  567.                         </select>
  568.                     </div>
  569.                     <div class="col-md-4">
  570.                         <select class="critere" id="sousCroisiereDuree" name="duree" style="margin-left: 10px; color: #9a9a9a; height: 42px; border-radius: 5px; width: 90%; box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5), 7px 7px 20px 0px rgba(0,0,0,.1), 4px 4px 5px 0px rgba(0,0,0,.1);">
  571.                             <option placeholder="" value="" {% if not duree %}selected{% endif %}>Durée</option>
  572.                             <!-- Option: 1 à 5 jours -->
  573.                             {% if groupedDurations['1-5'] is not empty %}
  574.                                 <option value="1-5" {% if duree == '1-5' %}selected{% endif %}>De 1 à 5 jours</option>
  575.                             {% endif %}
  576.                             <!-- Option: 6 à 9 jours -->
  577.                             {% if groupedDurations['6-9'] is not empty %}
  578.                                 <option value="6-9" {% if duree == '6-9' %}selected{% endif %}>De 6 à 9 jours</option>
  579.                             {% endif %}
  581.                             <!-- Option: Plus de 9 jours -->
  582.                             {% if groupedDurations['9+'] is not empty %}
  583.                                 <option value="9+" {% if duree == '9+' %}selected{% endif %}>Plus de 9 jours</option>
  584.                             {% endif %}
  585.                         </select>
  586.                     </div>
  587.                     <div class="col-md-4">
  588.                         <div class="row" style="margin-left: 10px">
  589.                             <button type="submit" class="custom-btn btn-4">Rechercher</button>
  590.                             <button type="reset" class="custom-btn btn-5" style="margin-left: 7px;">Réinitialiser les filtres</button>
  591.                         </div>
  592.                     </div>
  594.                 </div>
  595.             </form>
  596.         </div>
  597.     </div>
  598.     <div class="blog" style="background:#fafafa">
  599.         <div class="container">
  601.             <div class="col-lg-12">
  602.                 <div class="cards-1 section-gray">
  603.                     <div class="blog_post_container">
  604.                         {% if sousCroisieres is not empty %}
  605.                             <div class="container">
  606.                                 <div class="row">
  607.                                     <div class="col-lg-12">
  608.                                         <!-- Offers Grid -->
  609.                                         <div class="offers_grid" style="width: 108%">
  610.                                             {% for h in sousCroisieres %}
  611.                                                 {% if h.etat == 1 %}
  612.                                                     <div class="col-lg-6 offers_col">
  613.                                                         <div class="offers_item">
  614.                                                             <div class="row">
  615.                                                                 <div class="col-lg-4">
  616.                                                                     <div class="offers_image_container">
  617.                                                                         <div class="offers_image_background" >
  618.                                                                             <section class="ftco-section">
  619.                                                                                 <div class="container">
  620.                                                                                     <div class="row">
  621.                                                                                         <div class="col-md-12">
  622.                                                                                             <div class="featured-carousel owl-carousel">
  623.                                                                                                 {% for img in h.imagessouscroisieres %}
  624.                                                                                                     <div class="item">
  625.                                                                                                         <div class="work-wrap">
  626.                                                                                                             <div class="img order-md-last">
  627.                                                                                                                 <img src="{{ asset('./rusticav/public/uploads/souscroisieres/' ~ img.name) }}" alt=""/>
  628.                                                                                                             </div>
  629.                                                                                                         </div>
  630.                                                                                                     </div>
  631.                                                                                                 {% endfor %}
  632.                                                                                             </div>
  633.                                                                                         </div>
  634.                                                                                     </div>
  635.                                                                                 </div>
  636.                                                                             </section>
  637.                                                                         </div>
  639.                                                                     </div>
  640.                                                                 </div>
  641.                                                                 <div class="col-lg-6">
  642.                                                                     <div class="offers_content" style="font-size: 17px">
  643.                                                                         <div class="offers_price" style="color:#0093a9;font-size: 28px">{{ h.name }}</div><br>
  644.                                                                         <i class="fa fa-anchor" aria-hidden="true" style="color: #635959"></i>
  645.                                                                         <div class="offers_price" style="color:#635959;font-size: 16px;font-weight: 500">{{ h.destination }}</div><br>
  646.                                                                         <i class="fa fa-clock-o" aria-hidden="true" style="color: #635959"></i>
  647.                                                                         <div class="offers_price" style="color:#635959;font-size: 15px;font-weight: 500;">
  648.                                                                             {{h.duree}} jours / {{h.duree-1}} Nuits
  649.                                                                         </div><br>
  650.                                                                         <i class="fa fa-ship" aria-hidden="true"></i>
  651.                                                                         <div class="offers_price" style="margin-top: 4px;color: #635959;font-weight: 500;font-size: 16px">{{ h.navire.titre }}</div>
  652.                                                                         <div class="offers_icons">
  653.                                                                             <ul class="offers_icons_list">
  654.                                                                                 <li class="offers_icons_item">
  655.                                                                                     {% for ha in h.avantages %}
  656.                                                                                         <span class="badge badge-danger">
  657.                                                                                         {% for img in ha.imagesavantages %}
  658.                                                                                             <img src="{{ asset('./rusticav/public/uploads/avantages/' ~ img.name) }}" alt="" style="width:25px;height:25px;margin-top:-8px;"/>
  659.                                                                                         {% endfor %}
  660.                                                                                         <span>{{ ha.name }}</span>
  661.                                                                                     </span>
  662.                                                                                     {% endfor %}
  663.                                                                                 </li>
  664.                                                                             </ul>
  665.                                                                         </div>
  666.                                                                         <p style="font-weight: 700;font-size:16px;color:#1269a2;margin-bottom: 4px ">Prochaines dates de départ</p>
  667.                                                                         {% for hs in h.souscroisiereprices  %}
  668.                                                                             <span class="badge badge-danger" style="background: #1269a2;color: white">
  669.                                                                             {% set months = {
  670.                                                                                 1: 'Janvier',
  671.                                                                                 2: 'Février',
  672.                                                                                 3: 'Mars',
  673.                                                                                 4: 'Avril',
  674.                                                                                 5: 'Mai',
  675.                                                                                 6: 'Juin',
  676.                                                                                 7: 'Juillet',
  677.                                                                                 8: 'Août',
  678.                                                                                 9: 'Septembre',
  679.                                                                                 10: 'Octobre',
  680.                                                                                 11: 'Novembre',
  681.                                                                                 12: 'Décembre'
  682.                                                                             } %}
  684.                                                                                 {% set date = hs.dated|date('d-m-Y') %}
  685.                                                                                 {% set day = date|slice(0,2) %}
  686.                                                                                 {% set month = date|slice(3,2)|number_format(0, '', '') %}
  687.                                                                                 {% set year = date|slice(6,4) %}
  688.                                                                                 {{ day }} {{ months[month|number_format(0, '', '')] }} {{ year }}
  689.                                                                         </span>
  690.                                                                         {% endfor %}
  693.                                                                     </div>
  694.                                                                 </div>
  695.                                                                 <div class="col-lg-2">
  696.                                                                     <div class="offers_price" style="margin-top: 60px">
  697.                                                                         {% set minPrix = null %}
  699.                                                                         {% if h.souscroisiererooms is defined and h.souscroisiererooms|length > 0 %}
  700.                                                                             {% for cabine in h.souscroisiererooms %}
  701.                                                                                 {% if cabine.souscroisierepricerooms is defined and cabine.souscroisierepricerooms|length > 0 %}
  702.                                                                                     {% for priceCabine in cabine.souscroisierepricerooms %}
  703.                                                                                         {% if priceCabine.price is defined %}
  704.                                                                                             {% if minPrix is null or priceCabine.price < minPrix %}
  705.                                                                                                 {% set minPrix = priceCabine.price %}
  706.                                                                                             {% endif %}
  707.                                                                                         {% endif %}
  708.                                                                                     {% endfor %}
  709.                                                                                 {% endif %}
  710.                                                                             {% endfor %}
  711.                                                                         {% endif %}
  713.                                                                         <div class="offers_price1">
  714.                                                                             <span class="text-center" style="margin-left: 50px;font-size: 15px;color: black;font-weight: 300">A partir de:</span><br><br>
  715.                                                                             <span class="badges badge-success" style="font-size: 35px;font-weight: 600;margin-left: 17px;color: #5586c2">
  716.                                                                             {{ minPrix is not null ? minPrix : 'N/A' }} TND
  717.                                                                         </span>
  718.                                                                         </div>
  719.                                                                     </div>
  721.                                                                     <button class="custom-btn btn-3" style="left: -10%,">
  722.                                                                     <span style="color: white;font-size: 16px;font-weight: 500">
  723.                                                                         <a href="{{ path('sous_croisiere_details', {'sousCroisiereId': h.id}) }}" style="color: white">Voir Détails</a>
  724.                                                                     </span>
  725.                                                                     </button>
  726.                                                                 </div>
  727.                                                             </div>
  728.                                                         </div>
  729.                                                     </div>
  730.                                                 {% endif %}
  731.                                             {% endfor %}
  732.                                         </div>
  733.                                     </div>
  734.                                 </div>
  735.                             </div>
  736.                         {% endif %}
  737.                     </div>
  738.                 </div>
  739.             </div>
  740.         </div>
  741.     </div>
  742.     </div>
  745.     <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  746.     <script src="{{ asset('slider/js/popper.js') }}"></script>
  747.     <script src="{{ asset('slider/js/bootstrap.min.js') }}"></script>
  748.     <script src="{{ asset('slider/js/owl.carousel.min.js') }}"></script>
  749.     <script src="{{ asset('slider/js/main.js') }}"></script>
  750. {% endblock %}