var/cache/dev/twig/7f/7ff77c739a8255ba0f35a2e6155892cd.php line 49

Open in your IDE?
  1. <?php
  3. use Twig\Environment;
  4. use Twig\Error\LoaderError;
  5. use Twig\Error\RuntimeError;
  6. use Twig\Extension\CoreExtension;
  7. use Twig\Extension\SandboxExtension;
  8. use Twig\Markup;
  9. use Twig\Sandbox\SecurityError;
  10. use Twig\Sandbox\SecurityNotAllowedTagError;
  11. use Twig\Sandbox\SecurityNotAllowedFilterError;
  12. use Twig\Sandbox\SecurityNotAllowedFunctionError;
  13. use Twig\Source;
  14. use Twig\Template;
  15. use Twig\TemplateWrapper;
  17. /* vitrine/fr/homepage.html.twig */
  18. class __TwigTemplate_f3ef98ee2c394bb2ba6d1bc2a5ca5cc7 extends Template
  19. {
  20. private Source $source;
  21. /**
  22. * @var array<string, Template>
  23. */
  24. private array $macros = [];
  26. public function __construct(Environment $env)
  27. {
  28. parent::__construct($env);
  30. $this->source = $this->getSourceContext();
  32. $this->blocks = [
  33. 'title' => [$this, 'block_title'],
  34. 'description' => [$this, 'block_description'],
  35. 'robots' => [$this, 'block_robots'],
  36. 'canonical' => [$this, 'block_canonical'],
  37. 'body' => [$this, 'block_body'],
  38. 'footerjs' => [$this, 'block_footerjs'],
  39. 'css' => [$this, 'block_css'],
  40. ];
  41. }
  43. protected function doGetParent(array $context): bool|string|Template|TemplateWrapper
  44. {
  45. // line 1
  46. return "vitrine/fr/layout.html.twig";
  47. }
  49. protected function doDisplay(array $context, array $blocks = []): iterable
  50. {
  51. $macros = $this->macros;
  52. $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  53. $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "vitrine/fr/homepage.html.twig"));
  55. $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  56. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "vitrine/fr/homepage.html.twig"));
  58. $this->parent = $this->load("vitrine/fr/layout.html.twig", 1);
  59. yield from $this->parent->unwrap()->yield($context, array_merge($this->blocks, $blocks));
  61. $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  64. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  66. }
  68. // line 3
  69. /**
  70. * @return iterable<null|scalar|\Stringable>
  71. */
  72. public function block_title(array $context, array $blocks = []): iterable
  73. {
  74. $macros = $this->macros;
  75. $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  76. $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "title"));
  78. $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  79. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "title"));
  81. yield "Suite Cathedrale Heritage - Location 8 pers Strasbourg Centre";
  83. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  86. $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  88. yield from [];
  89. }
  91. // line 4
  92. /**
  93. * @return iterable<null|scalar|\Stringable>
  94. */
  95. public function block_description(array $context, array $blocks = []): iterable
  96. {
  97. $macros = $this->macros;
  98. $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  99. $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "description"));
  101. $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  102. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "description"));
  104. yield "Louez notre suite de 83m² au cœur de Strasbourg. 3 chambres, 8 personnes, à 100m de la Cathédrale. Cuisine équipée, 2 salles de bain. Réservez votre séjour!";
  106. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  109. $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  111. yield from [];
  112. }
  114. // line 5
  115. /**
  116. * @return iterable<null|scalar|\Stringable>
  117. */
  118. public function block_robots(array $context, array $blocks = []): iterable
  119. {
  120. $macros = $this->macros;
  121. $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  122. $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "robots"));
  124. $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  125. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "robots"));
  127. yield "index,follow";
  129. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  132. $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  134. yield from [];
  135. }
  137. // line 7
  138. /**
  139. * @return iterable<null|scalar|\Stringable>
  140. */
  141. public function block_canonical(array $context, array $blocks = []): iterable
  142. {
  143. $macros = $this->macros;
  144. $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  145. $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "canonical"));
  147. $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  148. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "canonical"));
  150. // line 8
  151. yield " <link rel=\"canonical\" href=\"https://cathedraleheritage.com/fr\" />
  152. <link rel=\"alternate\" hreflang=\"fr\" href=\"https://cathedraleheritage.com/fr\" />
  153. <link rel=\"alternate\" hreflang=\"en\" href=\"https://cathedraleheritage.com\" />
  154. <link rel=\"alternate\" hreflang=\"x-default\" href=\"https://cathedraleheritage.com\" />
  155. ";
  157. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  160. $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  162. yield from [];
  163. }
  165. // line 14
  166. /**
  167. * @return iterable<null|scalar|\Stringable>
  168. */
  169. public function block_body(array $context, array $blocks = []): iterable
  170. {
  171. $macros = $this->macros;
  172. $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  173. $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "body"));
  175. $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  176. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "body"));
  178. // line 15
  179. yield "
  180. <section id=\"hero\" class=\"text-light no-top no-bottom relative overflow-hidden z-1000\">
  181. <div class=\"abs w-100 abs-centered z-2\">
  182. <div class=\"container\">
  183. <div class=\"spacer-double\"></div>
  185. <div class=\"row g-4 align-items-center justify-content-center\">
  186. <div class=\"col-md-8 text-center\">
  187. <h1 class=\"mb-2\" style=\"color:white;\">Bienvenue sur la Suite Cathédrale Héritage</h1>
  188. <p class=\"lead mb-3\" style=\"color:white; font-size:22px;\">Appartement d'exception, pouvant accueillir jusqu'à 8 personnes au cœur du prestigieux centre historique de Strasbourg</p>
  189. <a class=\"btn-main btn-line bg-blur fx-slide\" href=\"#about\" style=\"color:white;\"><span>Découverte</span></a>
  190. </div>
  191. </div>
  192. </div>
  193. </div>
  194. <div class=\"vertical-center\">
  195. <div class=\"swiper\">
  196. <div class=\"swiper-wrapper\">
  197. <div class=\"swiper-slide\">
  198. <div class=\"swiper-inner\" data-bgimage=\"url(/images/salon2.jpeg)\">
  199. <div class=\"sw-overlay op-5\"></div>
  200. </div>
  201. </div>
  202. <div class=\"swiper-slide\">
  203. <div class=\"swiper-inner\" data-bgimage=\"url(/images/chambre2.jpeg)\">
  204. <div class=\"sw-overlay op-5\"></div>
  205. </div>
  206. </div>
  207. <div class=\"swiper-slide\">
  208. <div class=\"swiper-inner\" data-bgimage=\"url(/images/noel.jpeg)\">
  209. <div class=\"sw-overlay op-5\"></div>
  210. </div>
  211. </div>
  212. </div>
  213. </div>
  214. </div>
  216. <div class=\"abs w-100 bottom-0 z-2 pb-4 sm-hide\">
  217. <div class=\"container\">
  218. <div class=\"row\">
  219. <div class=\"col-lg-12\">
  220. <div class=\"d-flex justify-content-between\">
  221. <div>
  222. <h6 style=\"color:white;\">Cathédrale à 100m</h6>
  223. </div>
  224. <div>
  225. <h6 style=\"color:white;\">Musées à 200m</h6>
  226. </div>
  227. <div>
  228. <h6 style=\"color:white;\">Petite France à 300m</h6>
  229. </div>
  230. </div>
  231. </div>
  232. </div>
  233. </div>
  234. </div>
  235. <div class=\"gradient-edge-bottom op-8\"></div>
  236. </section>
  238. <section id=\"about\">
  239. <div class=\"container\">
  240. <div class=\"row g-4 align-items-end justify-content-between\">
  241. <div class=\"col-lg-5\">
  242. <div class=\"subtitle\">A propos de l'appartement</div>
  243. <h2>Suite moderne en hyper centre de la grande île de Strasbourg</h2>
  244. </div>
  246. <div class=\"col-lg-4\">
  247. <p class=\"mb-4\" style=\"color:#212121;\">
  248. Logement spacieux idéal pour familles et groupes jusqu'à 8 personnes, comprenant deux chambres doubles dont une suite parentale avec une salle de bain, une chambre avec deux lits superposés doubles (4 couchages) maximum de 100kg pour les lits en hauteur.
  249. </p>
  250. <p class=\"mb-4\" style=\"color:#212121;\">
  251. Cuisine entièrement équipée et salon-salle à manger convivial pour partager de bons moments ensemble.
  252. </p>
  253. <p class=\"mb-4\" style=\"color:#212121;\">
  254. Équipements : sèche-cheveux, lave-vaisselle, lave-linge séchant, micro-ondes, four, planche à repasser avec fer, cafetière Nespresso, bouilloire, télévision, Wi-Fi et prises USB pour recharger vos appareils.
  255. </p>
  256. </div>
  257. </div>
  259. <div class=\"spacer-single\"></div>
  261. <div class=\"row g-4\">
  262. <div class=\"col-md-2\">
  263. <div class=\"relative\">
  264. <h5>Taille</h5>
  265. <div class=\"d-flex justify-content-start align-items-center\" style=\"padding-top:6px;\">
  266. <img src=\"/images/home.png\" width=\"37\" class=\"me-3\" alt=\"\">
  267. <div class=\"fs-20 fw-600\" style=\"color:#212121;\">83 m²</div>
  268. </div>
  269. </div>
  270. </div>
  272. <div class=\"col-md-2\">
  273. <div class=\"relative\">
  274. <h5>Chambres</h5>
  275. <div class=\"d-flex justify-content-start align-items-center\" style=\"padding-top:4px;\">
  276. <img src=\"/images/bed.png\" width=\"37\" class=\"me-3\" alt=\"\">
  277. <div class=\"fs-20 fw-600\" style=\"color:#212121;\">3</div>
  278. </div>
  279. </div>
  280. </div>
  282. <div class=\"col-md-2\">
  283. <div class=\"relative\">
  284. <h5>Salon</h5>
  285. <div class=\"d-flex justify-content-start align-items-center\">
  286. <img src=\"/images/sofa.png\" width=\"50\" class=\"me-3\" alt=\"\">
  287. <div class=\"fs-20 fw-600\" style=\"color:#212121;\">Inclus</div>
  288. </div>
  289. </div>
  290. </div>
  292. <div class=\"col-md-2\">
  293. <div class=\"relative\">
  294. <h5>Cuisine</h5>
  295. <div class=\"d-flex justify-content-start align-items-center\" style=\"padding-top:6px;\">
  296. <img src=\"/images/cooking.png\" width=\"37\" class=\"me-3\" alt=\"\">
  297. <div class=\"fs-20 fw-600\" style=\"color:#212121;\">Inclus</div>
  298. </div>
  299. </div>
  300. </div>
  302. <div class=\"col-md-2\">
  303. <div class=\"relative\">
  304. <h5>Salle de bain</h5>
  305. <div class=\"d-flex justify-content-start align-items-center\" style=\"padding-top:4px;\">
  306. <img src=\"/images/bathroom.png\" width=\"40\" class=\"me-3\" alt=\"\">
  307. <div class=\"fs-20 fw-600\" style=\"color:#212121;\">2</div>
  308. </div>
  309. </div>
  310. </div>
  312. <div class=\"col-md-2\">
  313. <div class=\"relative\">
  314. <h5>Personnes</h5>
  315. <div class=\"d-flex justify-content-start align-items-center\" style=\"padding-top:5px;\">
  316. <img src=\"/images/user.png\" width=\"37\" class=\"me-3\" alt=\"\">
  317. <div class=\"fs-20 fw-600\" style=\"color:#212121;\">8</div>
  318. </div>
  319. </div>
  320. </div>
  321. </div>
  322. </div>
  323. </section>
  325. <section id=\"rooms\" class=\"p-0 overflow-hidden\">
  327. <div class=\"container-fluid\">
  328. <div class=\"row\">
  329. <div class=\"col-lg-12\">
  330. <div class=\"owl-custom-nav menu-float\" data-target=\"#room-carousel\">
  331. <a class=\"btn-next\"></a>
  332. <a class=\"btn-prev\"></a>
  334. <div id=\"room-carousel\" class=\"owl-2-cols-center owl-carousel owl-theme\">
  336. <div class=\"item\">
  337. <div class=\"relative\">
  338. <div class=\"overflow-hidden text-light\">
  339. <div class=\"abs h-100 start-0 z-2 p-4\">
  340. <h3 style=\"color:white;\">Salon</h3>
  341. </div>
  342. <img src=\"/images/salon2.jpeg\" class=\"w-100\" alt=\"Salon\">
  343. </div>
  344. </div>
  345. </div>
  347. <div class=\"item\">
  348. <div class=\"relative\">
  349. <div class=\"overflow-hidden text-light\">
  350. <div class=\"abs h-100 start-1 z-2 p-4\">
  351. <h3 style=\"color:white;\">Chambre 1</h3>
  352. </div>
  353. <img src=\"/images/chambre1.jpeg\" class=\"w-100\" alt=\"Chambre 1\">
  354. </div>
  355. </div>
  356. </div>
  358. <div class=\"item\">
  359. <div class=\"relative\">
  360. <div class=\"overflow-hidden text-light\">
  361. <div class=\"abs h-100 start-2 z-2 p-4\">
  362. <h3 style=\"color:white;\">Chambre 2</h3>
  363. </div>
  364. <img src=\"/images/chambre2.jpeg\" class=\"w-100\" alt=\"Chambre 2\">
  365. </div>
  366. </div>
  367. </div>
  369. <div class=\"item\">
  370. <div class=\"relative\">
  371. <div class=\"overflow-hidden text-light\">
  372. <div class=\"abs h-100 start-3 z-2 p-4\">
  373. <h3 style=\"color:white;\">Chambre 3</h3>
  374. </div>
  375. <img src=\"/images/chambre3.jpeg\" class=\"w-100\" alt=\"Chambre 3\">
  376. </div>
  377. </div>
  378. </div>
  380. <div class=\"item\">
  381. <div class=\"relative\">
  382. <div class=\"overflow-hidden text-light\">
  383. <div class=\"abs h-100 start-4 z-2 p-4\">
  384. <h3 style=\"color:white;\">Cuisine</h3>
  385. </div>
  386. <img src=\"/images/cuisine.jpeg\" class=\"w-100\" alt=\"Cuisine\">
  387. </div>
  388. </div>
  389. </div>
  391. <div class=\"item\">
  392. <div class=\"relative\">
  393. <div class=\"overflow-hidden text-light\">
  394. <div class=\"abs h-100 start-5 z-2 p-4\">
  395. <h3 style=\"color:white;\">Salle de bain</h3>
  396. </div>
  397. <img src=\"/images/salledebain.jpeg\" class=\"w-100\" alt=\"Salle de bain 1\">
  398. </div>
  399. </div>
  400. </div>
  402. <div class=\"item\">
  403. <div class=\"relative\">
  404. <div class=\"overflow-hidden text-light\">
  405. <div class=\"abs h-100 start-6 z-2 p-4\">
  406. <h3 style=\"color:white;\">Salle de bain 2</h3>
  407. </div>
  408. <img src=\"/images/salledebain2.jpeg\" class=\"w-100\" alt=\"Salle de bain 2\">
  409. </div>
  410. </div>
  411. </div>
  413. </div>
  414. </div>
  415. </div>
  416. </div>
  417. </div>
  419. </section>
  421. <section id=\"services\" class=\"overlay-dark-1\">
  422. <div class=\"container\">
  423. <div class=\"row g-4 justify-content-between\">
  424. <div class=\"col-lg-5 relative z-3\">
  425. <div class=\"me-lg-3\">
  426. <div class=\"subtitle wow fadeInUp\" data-wow-delay=\".0s\">Votre séjour à Strasbourg</div>
  427. <h2 class=\"wow fadeInUp\" data-wow-delay=\".2s\">Tarifs et services</h2>
  428. <p style=\"color:#212121; font-size:18px;\">Une suite d'exception au cœur de Strasbourg, avec conciergerie dédiée pour vous accompagner tout au long de votre séjour.</p>
  430. <p style=\"color:#212121; font-size:18px;\">Réservation minimum deux nuits.</p>
  432. <a href=\"#reservation\" class=\"btn-main\" style=\"color:white;\">Réservation</a>
  435. </div>
  436. </div>
  438. <div class=\"col-lg-6\" style=\"color:black;\">
  439. <div class=\"spacer-single spacer-double\"></div>
  440. <div class=\"row\">
  441. <div class=\"col-md-6 wow fadeInUp\" data-wow-delay=\".2s\">
  443. ";
  444. // line 289
  445. yield "
  446. <ul class=\"ul-check fs-500\">
  447. <li>à partir de 350€ la nuit </li>
  448. <li>10% de remise à partir de 7 nuits</li>
  449. </ul>
  450. </div>
  452. <div class=\"col-md-6 wow fadeInUp\" data-wow-delay=\".4s\">
  453. <h5 class=\"mb-3\">Services optionnels</h5>
  454. <ul class=\"ul-check fs-500\">
  455. <li>Une place de parking : 24 €/jour ou 150 €/semaine</li>
  456. <li>Ménage supplémentaire durant votre séjour : 60 euros</li>
  457. <li>Apéro alsacien : sur commande</li>
  458. <li>Atelier pour enfants, équipements bébé, chiens acceptés sur demande (les autres animaux ne sont malheureusement pas autorisés dans l'appartement), Décoration pour occasions spéciales,…</li>
  459. </ul>
  461. <div class=\"mt-4\">
  462. <p class=\"fs-500\"><strong>Conciergerie sur place</strong><br>
  463. <small>Mardi au samedi • 10h-18h45 <br /> Conciergerie privée sur demande selon disponibilité <br /> Sur devis (Correspond à 10% de la réservation)</small>
  464. </p>
  465. </div>
  466. </div>
  467. </div>
  468. </div>
  469. </div>
  472. </div>
  473. </section>
  475. <section id=\"section-gallery\" class=\"relative\">
  476. <div class=\"container relative z-2\" id=\"photos\">
  477. <div class=\"row g-4 gx-5 justify-content-center\">
  478. <div class=\"col-lg-6 text-center\">
  479. <h2 class=\"wow fadeInUp\" data-wow-delay=\".2s\">Galerie de l'Appartement</h2>
  480. <p class=\"wow fadeInUp\" data-wow-delay=\".3s\" style=\"color:#212121;\">Voici les images de l'appartement qui vous permettront de découvrir les différents espaces : chambres, salon, cuisine, salle de bain et extérieur.</p>
  481. </div>
  482. </div>
  484. <div class=\"row\">
  485. <div class=\"col-md-12 text-center\">
  486. <ul id=\"filters\" class=\"wow fadeInUp\" data-wow-delay=\"0s\">
  487. <li><a href=\"#\" data-filter=\"*\" class=\"selected\" style=\"color:#212121;\">Tout afficher</a></li>
  488. <li><a href=\"#\" data-filter=\".chambre\" style=\"color:#212121;\">Chambres</a></li>
  489. <li><a href=\"#\" data-filter=\".salon\" style=\"color:#212121;\">Salon</a></li>
  490. <li><a href=\"#\" data-filter=\".cuisine\" style=\"color:#212121;\">Cuisine</a></li>
  491. <li><a href=\"#\" data-filter=\".salledebain\" style=\"color:#212121;\">Salle de bain</a></li>
  492. <li><a href=\"#\" data-filter=\".exterieur\" style=\"color:#212121;\">Extérieur</a></li>
  493. </ul>
  494. </div>
  495. </div>
  497. <div id=\"gallery\" class=\"row g-3 wow fadeInUp\" data-wow-delay=\".3s\">
  499. <!-- Chambres -->
  500. <div class=\"col-md-3 col-sm-6 col-12 item chambre\">
  501. <a href=\"images/chambre1.jpeg\" class=\"image-popup d-block hover\">
  502. <div class=\"relative overflow-hidden\">
  503. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  504. Voir
  505. </div>
  506. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  507. <img src=\"images/chambre1.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Chambre\">
  508. </div>
  509. </a>
  510. </div>
  512. <div class=\"col-md-3 col-sm-6 col-12 item chambre\">
  513. <a href=\"images/chambre2.jpeg\" class=\"image-popup d-block hover\">
  514. <div class=\"relative overflow-hidden\">
  515. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  516. Voir
  517. </div>
  518. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  519. <img src=\"images/chambre2.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Chambre 2\">
  520. </div>
  521. </a>
  522. </div>
  524. <div class=\"col-md-3 col-sm-6 col-12 item chambre\">
  525. <a href=\"images/chambre3.jpeg\" class=\"image-popup d-block hover\">
  526. <div class=\"relative overflow-hidden\">
  527. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  528. Voir
  529. </div>
  530. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  531. <img src=\"images/chambre3.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Chambre 3\">
  532. </div>
  533. </a>
  534. </div>
  536. <!-- Salon -->
  537. <div class=\"col-md-3 col-sm-6 col-12 item salon\">
  538. <a href=\"images/salon.jpeg\" class=\"image-popup d-block hover\">
  539. <div class=\"relative overflow-hidden\">
  540. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  541. Voir
  542. </div>
  543. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  544. <img src=\"images/salon.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salon\">
  545. </div>
  546. </a>
  547. </div>
  549. <div class=\"col-md-3 col-sm-6 col-12 item salon\">
  550. <a href=\"images/salon2.jpeg\" class=\"image-popup d-block hover\">
  551. <div class=\"relative overflow-hidden\">
  552. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  553. Voir
  554. </div>
  555. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  556. <img src=\"images/salon2.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salon 2\">
  557. </div>
  558. </a>
  559. </div>
  561. <div class=\"col-md-3 col-sm-6 col-12 item salon\">
  562. <a href=\"images/salon3.jpeg\" class=\"image-popup d-block hover\">
  563. <div class=\"relative overflow-hidden\">
  564. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  565. Voir
  566. </div>
  567. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  568. <img src=\"images/salon3.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salon 3\">
  569. </div>
  570. </a>
  571. </div>
  573. <div class=\"col-md-3 col-sm-6 col-12 item salon\">
  574. <a href=\"images/salon4.jpeg\" class=\"image-popup d-block hover\">
  575. <div class=\"relative overflow-hidden\">
  576. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  577. Voir
  578. </div>
  579. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  580. <img src=\"images/salon4.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salon 4\">
  581. </div>
  582. </a>
  583. </div>
  585. <div class=\"col-md-3 col-sm-6 col-12 item salon\">
  586. <a href=\"images/salon5.jpeg\" class=\"image-popup d-block hover\">
  587. <div class=\"relative overflow-hidden\">
  588. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  589. Voir
  590. </div>
  591. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  592. <img src=\"images/salon5.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salon 5\">
  593. </div>
  594. </a>
  595. </div>
  597. <!-- Cuisine -->
  598. <div class=\"col-md-3 col-sm-6 col-12 item cuisine\">
  599. <a href=\"images/cuisine.jpeg\" class=\"image-popup d-block hover\">
  600. <div class=\"relative overflow-hidden\">
  601. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  602. Voir
  603. </div>
  604. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  605. <img src=\"images/cuisine.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Cuisine\">
  606. </div>
  607. </a>
  608. </div>
  610. <!-- Salle de bain -->
  611. <div class=\"col-md-3 col-sm-6 col-12 item salledebain\">
  612. <a href=\"images/salledebain.jpeg\" class=\"image-popup d-block hover\">
  613. <div class=\"relative overflow-hidden\">
  614. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  615. Voir
  616. </div>
  617. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  618. <img src=\"images/salledebain.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salle de bain\">
  619. </div>
  620. </a>
  621. </div>
  623. <div class=\"col-md-3 col-sm-6 col-12 item salledebain\">
  624. <a href=\"images/salledebain2.jpeg\" class=\"image-popup d-block hover\">
  625. <div class=\"relative overflow-hidden\">
  626. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  627. Voir
  628. </div>
  629. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  630. <img src=\"images/salledebain2.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salle de bain 2\">
  631. </div>
  632. </a>
  633. </div>
  635. <!-- Extérieur -->
  636. <div class=\"col-md-3 col-sm-6 col-12 item exterieur\">
  637. <a href=\"images/exterieur.jpeg\" class=\"image-popup d-block hover\">
  638. <div class=\"relative overflow-hidden\">
  639. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  640. Voir
  641. </div>
  642. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  643. <img src=\"images/exterieur.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Extérieur\">
  644. </div>
  645. </a>
  646. </div>
  648. </div>
  650. </div>
  651. </section>
  653. ";
  654. // line 498
  655. yield " ";
  656. // line 499
  657. yield " ";
  658. // line 500
  659. yield " <section id=\"reservation\" class=\"text-light\">
  660. <div class=\"container\">
  661. <div class=\"row g-4 justify-content-center\">
  662. <div class=\"col-lg-6 text-center\">
  663. <h2 class=\"wow fadeInUp\" data-wow-delay=\".2s\">Réservez votre séjour</h2>
  664. </div>
  665. </div>
  667. <div class=\"row g-4 justify-content-center\">
  668. <div class=\"col-lg-8\">
  669. <div class=\"booking-card\">
  670. ";
  671. // line 511
  672. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->renderBlock((isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 511, $this->source); })()), 'form_start');
  673. yield "
  675. ";
  676. // line 514
  677. yield " <div class=\"calendar-container\" style=\"height:300px;\">
  678. <input type=\"text\" id=\"date_range_picker\">
  679. </div>
  681. ";
  682. // line 519
  683. yield " <div class=\"row g-3 mt-2 dates-recap\">
  684. <div class=\"col-4 text-center\">
  685. <div class=\"recap-label\">Arrivée</div>
  686. <div class=\"recap-value\" id=\"info-start\">-</div>
  687. </div>
  688. <div class=\"col-4 text-center\">
  689. <div class=\"recap-label\">Départ</div>
  690. <div class=\"recap-value\" id=\"info-end\">-</div>
  691. </div>
  692. <div class=\"col-4 text-center\">
  693. <div class=\"recap-label\">Nuits</div>
  694. <div class=\"recap-value\" id=\"info-nights\">-</div>
  695. </div>
  696. </div>
  698. <hr class=\"booking-divider\">
  700. ";
  701. // line 537
  702. yield " <h4 class=\"booking-title\">Indiquez le nombre d'hébergements et de personnes</h4>
  704. <div class=\"counter-row\">
  705. <div class=\"counter-label\">
  706. <div class=\"counter-title\">Chambres</div>
  707. <div class=\"counter-sub\">Selon le nombre de voyageurs</div>
  708. </div>
  709. <div class=\"counter-controls\">
  710. <button type=\"button\" class=\"counter-btn\" data-action=\"dec\" data-target=\"rooms\">−</button>
  711. <span class=\"counter-value\" id=\"cnt-rooms\">1</span>
  712. <button type=\"button\" class=\"counter-btn\" data-action=\"inc\" data-target=\"rooms\">+</button>
  713. </div>
  714. </div>
  716. <div class=\"counter-row\">
  717. <div class=\"counter-label\">
  718. <div class=\"counter-title\">Adultes</div>
  719. </div>
  720. <div class=\"counter-controls\">
  721. <button type=\"button\" class=\"counter-btn\" data-action=\"dec\" data-target=\"adults\">−</button>
  722. <span class=\"counter-value\" id=\"cnt-adults\">2</span>
  723. <button type=\"button\" class=\"counter-btn\" data-action=\"inc\" data-target=\"adults\">+</button>
  724. </div>
  725. </div>
  727. <div class=\"counter-row\">
  728. <div class=\"counter-label\">
  729. <div class=\"counter-title\">Enfants</div>
  730. <div class=\"counter-sub\">1 - 17 ans</div>
  731. </div>
  732. <div class=\"counter-controls\">
  733. <button type=\"button\" class=\"counter-btn\" data-action=\"dec\" data-target=\"children\">−</button>
  734. <span class=\"counter-value\" id=\"cnt-children\">0</span>
  735. <button type=\"button\" class=\"counter-btn\" data-action=\"inc\" data-target=\"children\">+</button>
  736. </div>
  737. </div>
  739. <div id=\"capacity-warning\" class=\"capacity-warning\" style=\"display:none;\"></div>
  741. ";
  742. // line 577
  743. yield " <div id=\"results\" class=\"mt-3\"></div>
  745. <hr class=\"booking-divider\">
  747. ";
  748. // line 582
  749. yield " <div class=\"row g-3\">
  750. <div class=\"col-md-6\">
  751. <label class=\"booking-label\">Nom</label>
  752. ";
  753. // line 585
  754. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 585, $this->source); })()), "lastname", [], "any", false, false, false, 585), 'widget');
  755. yield "
  756. </div>
  757. <div class=\"col-md-6\">
  758. <label class=\"booking-label\">Prénom</label>
  759. ";
  760. // line 589
  761. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 589, $this->source); })()), "name", [], "any", false, false, false, 589), 'widget');
  762. yield "
  763. </div>
  764. <div class=\"col-md-12\">
  765. <label class=\"booking-label\">Email</label>
  766. ";
  767. // line 593
  768. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 593, $this->source); })()), "email", [], "any", false, false, false, 593), 'widget');
  769. yield "
  770. </div>
  771. <div class=\"col-md-12\">
  772. <label class=\"booking-label\">Message</label>
  773. ";
  774. // line 597
  775. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 597, $this->source); })()), "message", [], "any", false, false, false, 597), 'widget');
  776. yield "
  777. </div>
  778. </div>
  780. ";
  781. // line 602
  782. yield " <div class=\"text-center mt-4 cgv-block\">
  783. <input type=\"checkbox\" id=\"acceptCGV\"> J'accepte les <a href=\"";
  784. // line 603
  785. yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("locale_cgv");
  786. yield "\" target=\"_blank\" style=\"color:#212121; text-decoration:underline;\">CGV</a>
  787. </div>
  788. <div class=\"text-center mt-3\">
  789. <button type=\"submit\" name=\"submit\" value=\"1\" class=\"btn-main\" style=\"color:white;\">Confirmer la réservation</button>
  790. </div>
  792. ";
  793. // line 610
  794. yield " ";
  795. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 610, $this->source); })()), "start", [], "any", false, false, false, 610), 'widget');
  796. yield "
  797. ";
  798. // line 611
  799. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 611, $this->source); })()), "end", [], "any", false, false, false, 611), 'widget');
  800. yield "
  801. ";
  802. // line 612
  803. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 612, $this->source); })()), "rooms", [], "any", false, false, false, 612), 'widget');
  804. yield "
  805. ";
  806. // line 613
  807. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 613, $this->source); })()), "adults", [], "any", false, false, false, 613), 'widget');
  808. yield "
  809. ";
  810. // line 614
  811. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 614, $this->source); })()), "children", [], "any", false, false, false, 614), 'widget');
  812. yield "
  813. ";
  814. // line 615
  815. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 615, $this->source); })()), "persons", [], "any", false, false, false, 615), 'widget');
  816. yield "
  818. ";
  819. // line 617
  820. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock((isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 617, $this->source); })()), 'rest');
  821. yield "
  822. ";
  823. // line 618
  824. yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->renderBlock((isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 618, $this->source); })()), 'form_end');
  825. yield "
  826. </div>
  827. </div>
  828. </div>
  829. </div>
  830. </section>
  832. <section id=\"faq\" class=\"text-light\">
  833. <div class=\"container\">
  835. <div class=\"row g-4 justify-content-center\">
  836. <div class=\"col-lg-6 text-center\">
  837. <h2 class=\"wow fadeInUp\" data-wow-delay=\".2s\">FAQ</h2>
  838. </div>
  839. </div>
  841. <div class=\"row g-4 justify-content-center\">
  842. <div class=\"col-lg-6 text-left\" style=\"color:black !important;\">
  844. <h3 style=\"margin-top:7px;\">Comment réserver le logement ?</h3>
  846. <div>Vous pouvez réserver directement sur notre site et bientôt via les plateformes partenaires. Le paiement sécurisé confirme immédiatement votre réservation.</div>
  848. <h3 style=\"margin-top:7px;\">Quels sont les horaires d'arrivée et de départ ?</h3>
  849. <ul>
  850. <li>Arrivée : à partir de 15h</li>
  851. <li>Départ : avant 11h</li>
  852. </ul>
  854. <h3 style=\"margin-top:7px;\">Le logement est-il entièrement équipé ?</h3>
  855. <div>Oui, le logement est entièrement meublé et équipé : cuisine, literie, serviettes, électroménager, Wi-Fi,…</div>
  857. <h3 style=\"margin-top:7px;\">Y a-t-il un parking disponible ?</h3>
  858. <div>Oui, un parking privatif est possible en option au prix de 24 euros les 24h ou 150 euros la semaine (7 nuits).</div>
  860. <h3 style=\"margin-top:7px;\">Le logement est-il adapté aux enfants ?</h3>
  861. <div>Oui, nous proposons certains équipements pour enfants (lit bébé, chaise haute, vaisselle adaptée) sur demande.</div>
  863. <h3 style=\"margin-top:7px;\">Les animaux sont-ils acceptés ?</h3>
  864. <div>Merci de nous contacter avant de réserver si vous souhaitez venir avec un animal, les chiens sont les seuls animaux acceptés, mais soumis à une demande préalable.</div>
  866. <h3 style=\"margin-top:7px;\">Puis-je annuler ou modifier ma réservation ?</h3>
  867. <div>Oui, nos conditions d'annulation sont précisées lors de la réservation. Remboursement de 85% du montant de la location si annulation plus d'un mois avant la date d'arrivée, puis 50 % remboursés si annulation entre 1 mois et 15 jours avant la date d'arrivée. Pas de remboursement si annulation moins de 15 jours avant la date d'arrivée.</div>
  869. <h3 style=\"margin-top:7px;\">Le logement est-il accessible en transport public ?</h3>
  870. <div>Oui, les principaux transports sont proches. La station de tram « Langstross, Grand'rue » est à moins de 100 mètres de l'appartement. La gare de Strasbourg est à 10 minutes à pieds.</div>
  872. <h3 style=\"margin-top:7px;\">Y a-t-il des commerces ou restaurants à proximité ?</h3>
  873. <div>Oui, vous trouverez supermarchés, cafés, restaurants et activités touristiques au pied de l'immeuble.</div>
  875. <h3 style=\"margin-top:7px;\">Que faire en cas de problème pendant le séjour ?</h3>
  876. <div>Nous restons disponibles 24h/24 par mail, pour toute urgence ou question concernant le logement, vous pouvez aussi nous joindre entre 9h et 20h par téléphone au 07 61 05 82 43 et nous sommes disponibles</div>
  878. </div>
  879. </div>
  881. </div>
  882. </section>
  884. ";
  886. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  889. $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  891. yield from [];
  892. }
  894. // line 679
  895. /**
  896. * @return iterable<null|scalar|\Stringable>
  897. */
  898. public function block_footerjs(array $context, array $blocks = []): iterable
  899. {
  900. $macros = $this->macros;
  901. $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  902. $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "footerjs"));
  904. $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  905. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "footerjs"));
  907. // line 680
  908. yield " <script src=\"https://cdn.jsdelivr.net/npm/flatpickr\"></script>
  909. <script src=\"https://cdn.jsdelivr.net/npm/flatpickr/dist/l10n/fr.js\"></script>
  911. ";
  912. // line 684
  913. yield " <script>
  914. window.PRICING_MATRIX = ";
  915. // line 685
  916. yield json_encode((isset($context["pricingMatrix"]) || array_key_exists("pricingMatrix", $context) ? $context["pricingMatrix"] : (function () { throw new RuntimeError('Variable "pricingMatrix" does not exist.', 685, $this->source); })()));
  917. yield ";
  918. window.SIMULATION_URL = \"";
  919. // line 686
  920. yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("locale_simulation_pricing", ["_locale" => "fr"]);
  921. yield "\";
  922. console.log('📋 Grille basse saison chargée :', window.PRICING_MATRIX);
  923. console.log('🔗 URL simulation :', window.SIMULATION_URL);
  924. </script>
  926. <script>
  927. // ===========================================================
  928. // Logique chambres / adultes / enfants
  929. //
  930. // Configuration physique :
  931. // - Chambre A : lit double → 2 personnes
  932. // - Chambre B : lit double → 2 personnes
  933. // - Chambre C : lits superposés → 4 personnes (adultes/enfants)
  934. //
  935. // Le nombre de chambres est DÉTERMINÉ automatiquement (pas de choix) :
  936. //
  937. // SANS ENFANTS :
  938. // 1-2 ad → 1 ch
  939. // 3-4 ad → 2 ch
  940. // 5-8 ad → 3 ch
  941. //
  942. // AVEC ENFANTS :
  943. // 1-2 ad → 2 ch (chambre A + chambre superposés)
  944. // 3+ ad → 3 ch (A + B + chambre superposés)
  945. //
  946. // Contraintes : adults + children ≤ 8, children ≤ 4, adults ≥ 1
  947. // ===========================================================
  949. function roomsForCombo(adults, children) {
  950. if (children > 0) {
  951. return adults <= 2 ? 2 : 3;
  952. }
  953. if (adults <= 2) return 1;
  954. if (adults <= 4) return 2;
  955. return 3;
  956. }
  958. function canAddAdult(state) {
  959. if (state.adults >= 8) return false;
  960. return (state.adults + 1 + state.children) <= 8;
  961. }
  963. function canAddChild(state) {
  964. if (state.children >= 4) return false;
  965. return (state.adults + state.children + 1) <= 8;
  966. }
  968. const state = { rooms: 1, adults: 2, children: 0 };
  970. function updateDisplay() {
  971. // Le nombre de chambres est recalculé automatiquement à chaque update
  972. state.rooms = roomsForCombo(state.adults, state.children);
  974. \$('#cnt-rooms').text(state.rooms);
  975. \$('#cnt-adults').text(state.adults);
  976. \$('#cnt-children').text(state.children);
  978. \$('#reservation_form_rooms').val(state.rooms);
  979. \$('#reservation_form_adults').val(state.adults);
  980. \$('#reservation_form_children').val(state.children);
  981. \$('#reservation_form_persons').val(state.adults + state.children);
  983. \$('.counter-btn').each(function() {
  984. const target = \$(this).data('target');
  985. const action = \$(this).data('action');
  986. let disabled = false;
  988. if (target === 'rooms') {
  989. // Chambres = toujours verrouillé (déterminé par adultes/enfants)
  990. disabled = true;
  991. }
  992. if (target === 'adults') {
  993. if (action === 'dec' && state.adults <= 1) disabled = true;
  994. if (action === 'inc' && !canAddAdult(state)) disabled = true;
  995. }
  996. if (target === 'children') {
  997. if (action === 'dec' && state.children <= 0) disabled = true;
  998. if (action === 'inc' && !canAddChild(state)) disabled = true;
  999. }
  1001. \$(this).prop('disabled', disabled).toggleClass('disabled', disabled);
  1002. });
  1004. \$('#capacity-warning').hide();
  1005. }
  1007. \$(document).on('click', '.counter-btn', function() {
  1008. if (\$(this).prop('disabled')) return;
  1010. const target = \$(this).data('target');
  1011. const action = \$(this).data('action');
  1013. // Aucune action sur \"rooms\" (toujours désactivé)
  1015. if (target === 'adults') {
  1016. if (action === 'inc' && canAddAdult(state)) state.adults++;
  1017. if (action === 'dec' && state.adults > 1) state.adults--;
  1018. }
  1020. if (target === 'children') {
  1021. if (action === 'inc' && canAddChild(state)) state.children++;
  1022. if (action === 'dec' && state.children > 0) state.children--;
  1023. }
  1025. updateDisplay();
  1026. updateSimulation();
  1027. });
  1029. function updateSimulation() {
  1030. const start = \$(\"#reservation_form_start\").val();
  1031. const end = \$(\"#reservation_form_end\").val();
  1032. const persons = state.adults + state.children;
  1034. console.log('🔄 updateSimulation', { start, end, rooms: state.rooms, adults: state.adults, children: state.children });
  1036. if (!start || !end || persons < 1) {
  1037. \$(\"#results\").html('');
  1038. return;
  1039. }
  1041. \$(\"#results\").html('<div class=\"loading\" style=\"color:#212121;\">Calcul en cours...</div>');
  1043. \$.post(
  1044. window.SIMULATION_URL,
  1045. { start: start, end: end, rooms: state.rooms, adults: state.adults, children: state.children }
  1046. )
  1047. .done(function(data) {
  1048. console.log('✅ Simulation OK');
  1049. \$(\"#results\").html(data);
  1050. })
  1051. .fail(function(xhr) {
  1052. console.error('❌ Simulation KO', xhr.status, xhr.responseText);
  1053. \$(\"#results\").html('<div class=\"error\" style=\"color:#a00;\">Erreur lors du calcul du prix (' + xhr.status + ')</div>');
  1054. });
  1055. }
  1057. \$(document).ready(function() {
  1058. updateDisplay();
  1060. // Bouton submit désactivé tant que CGV non cochées
  1061. \$('button[type=\"submit\"]').prop('disabled', true);
  1062. \$('#acceptCGV').change(function() {
  1063. \$('button[type=\"submit\"]').prop('disabled', !\$(this).is(':checked'));
  1064. });
  1065. });
  1066. </script>
  1068. <script>
  1069. // ===========================================================
  1070. // Flatpickr calendrier
  1071. // ===========================================================
  1072. \$(document).ready(function() {
  1073. let bookedRanges = [];
  1075. \$.ajax({
  1076. url: '";
  1077. // line 841
  1078. yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['App\Twig\CoreExtension']->getEnvironmentVariable("WEBHOOK_CALENDAR_AVAILABILITY"), "html", null, true);
  1079. yield "',
  1080. method: 'POST',
  1081. contentType: 'application/json',
  1082. data: ''
  1083. })
  1084. .done(function(data) {
  1085. bookedRanges = data.bookings || [];
  1086. initDatePicker();
  1087. })
  1088. .fail(function() { initDatePicker(); });
  1090. function parseLocalDate(dateStr) {
  1091. const [year, month, day] = dateStr.split('-').map(Number);
  1092. return new Date(year, month - 1, day);
  1093. }
  1095. const isMobile = window.innerWidth <= 900;
  1097. function initDatePicker() {
  1098. flatpickr(\"#date_range_picker\", {
  1099. inline: true,
  1100. mode: \"range\",
  1101. locale: \"fr\",
  1102. minDate: new Date(new Date().setDate(new Date().getDate() + 1)),
  1103. dateFormat: \"Y-m-d\",
  1104. showMonths: isMobile ? 1 : 2,
  1106. disable: [
  1107. function(date) {
  1108. const checkDate = new Date(date);
  1109. checkDate.setHours(0, 0, 0, 0);
  1110. return bookedRanges.some(range => {
  1111. const start = parseLocalDate(range.start_date);
  1112. const end = parseLocalDate(range.end_date);
  1113. return checkDate >= start && checkDate <= end;
  1114. });
  1115. }
  1116. ],
  1118. onChange: function(selectedDates, dateStr, instance) {
  1119. if (selectedDates.length === 2) {
  1120. const start = selectedDates[0];
  1121. const end = selectedDates[1];
  1123. if (isRangeAvailable(start, end)) {
  1124. \$('#reservation_form_start').val(formatDate(start)).trigger('change');
  1125. \$('#reservation_form_end').val(formatDate(end)).trigger('change');
  1126. updateSelectedInfo(start, end);
  1127. updateSimulation();
  1128. } else {
  1129. alert('⚠️ Cette période contient des dates déjà réservées.');
  1130. instance.clear();
  1131. clearSymfonyFields();
  1132. hideSelectedInfo();
  1133. \$(\"#results\").html('');
  1134. }
  1135. } else {
  1136. clearSymfonyFields();
  1137. hideSelectedInfo();
  1138. \$(\"#results\").html('');
  1139. }
  1140. },
  1142. onDayCreate: function(dObj, dStr, fp, dayElem) {
  1143. const date = new Date(dayElem.dateObj);
  1144. date.setHours(0, 0, 0, 0);
  1145. const isBooked = bookedRanges.some(range => {
  1146. const start = parseLocalDate(range.start_date);
  1147. const end = parseLocalDate(range.end_date);
  1148. return date >= start && date <= end;
  1149. });
  1150. if (isBooked) {
  1151. dayElem.classList.add('booked');
  1152. dayElem.title = 'Date indisponible (réservée)';
  1153. } else if (date >= new Date()) {
  1154. dayElem.classList.add('available');
  1155. }
  1156. }
  1157. });
  1158. }
  1160. function isRangeAvailable(startDate, endDate) {
  1161. let currentDate = new Date(startDate);
  1162. currentDate.setHours(0, 0, 0, 0);
  1163. const endCheck = new Date(endDate);
  1164. endCheck.setHours(0, 0, 0, 0);
  1165. while (currentDate <= endCheck) {
  1166. const isBooked = bookedRanges.some(range => {
  1167. const start = parseLocalDate(range.start_date);
  1168. const end = parseLocalDate(range.end_date);
  1169. return currentDate >= start && currentDate <= end;
  1170. });
  1171. if (isBooked) return false;
  1172. currentDate.setDate(currentDate.getDate() + 1);
  1173. }
  1174. return true;
  1175. }
  1177. function updateSelectedInfo(start, end) {
  1178. const nights = Math.ceil((end - start) / (1000 * 60 * 60 * 24));
  1179. \$('#info-start').text(start.toLocaleDateString('fr-FR'));
  1180. \$('#info-end').text(end.toLocaleDateString('fr-FR'));
  1181. \$('#info-nights').text(`\${nights} nuit\${nights > 1 ? 's' : ''}`);
  1182. }
  1184. function hideSelectedInfo() {
  1185. \$('#info-start').text('-');
  1186. \$('#info-end').text('-');
  1187. \$('#info-nights').text('-');
  1188. }
  1190. function clearSymfonyFields() {
  1191. \$('#reservation_form_start').val('');
  1192. \$('#reservation_form_end').val('');
  1193. }
  1195. function formatDate(date) {
  1196. return date.getFullYear() + '-' +
  1197. String(date.getMonth() + 1).padStart(2, '0') + '-' +
  1198. String(date.getDate()).padStart(2, '0');
  1199. }
  1200. });
  1201. </script>
  1202. ";
  1204. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  1207. $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  1209. yield from [];
  1210. }
  1212. // line 966
  1213. /**
  1214. * @return iterable<null|scalar|\Stringable>
  1215. */
  1216. public function block_css(array $context, array $blocks = []): iterable
  1217. {
  1218. $macros = $this->macros;
  1219. $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  1220. $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "css"));
  1222. $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  1223. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "css"));
  1225. // line 967
  1226. yield " <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css\">
  1227. <style>
  1228. /* ===========================================================
  1229. Booking card (border blanc, fond transparent, texte noir)
  1230. =========================================================== */
  1231. .booking-card {
  1232. background: transparent;
  1233. border: 2px solid white;
  1234. border-radius: 12px;
  1235. padding: 32px;
  1236. color: #212121;
  1237. }
  1238. .booking-title {
  1239. color: #212121;
  1240. font-weight: 700;
  1241. margin-bottom: 24px;
  1242. }
  1243. .booking-divider {
  1244. border-top: 1px solid rgba(0,0,0,0.15);
  1245. margin: 28px 0;
  1246. }
  1247. .booking-label {
  1248. color: #212121;
  1249. font-weight: 500;
  1250. margin-bottom: 6px;
  1251. display: block;
  1252. }
  1253. .booking-card input.form-control,
  1254. .booking-card textarea.form-control {
  1255. background: rgba(255,255,255,0.85) !important;
  1256. border: 1px solid rgba(0,0,0,0.2) !important;
  1257. color: #212121 !important;
  1258. }
  1259. .booking-card input.form-control::placeholder,
  1260. .booking-card textarea.form-control::placeholder {
  1261. color: rgba(0,0,0,0.4) !important;
  1262. }
  1263. .booking-card input.form-control:focus,
  1264. .booking-card textarea.form-control:focus {
  1265. border-color: #212121 !important;
  1266. box-shadow: 0 0 0 0.2rem rgba(0,0,0,0.08) !important;
  1267. }
  1269. .cgv-block { color: #212121; }
  1270. .cgv-block a { color: #212121; text-decoration: underline; }
  1272. /* ----- Dates récap ----- */
  1273. .dates-recap { color: #212121; }
  1274. .recap-label {
  1275. font-size: 13px;
  1276. text-transform: uppercase;
  1277. letter-spacing: 0.5px;
  1278. opacity: 0.7;
  1279. }
  1280. .recap-value {
  1281. font-size: 18px;
  1282. font-weight: 600;
  1283. margin-top: 4px;
  1284. }
  1286. /* ----- Widget compteurs ----- */
  1287. .counter-row {
  1288. display: flex;
  1289. justify-content: space-between;
  1290. align-items: center;
  1291. padding: 14px 0;
  1292. border-bottom: 1px solid rgba(0,0,0,0.1);
  1293. }
  1294. .counter-row:last-of-type { border-bottom: none; }
  1295. .counter-title {
  1296. font-size: 16px;
  1297. font-weight: 500;
  1298. color: #212121;
  1299. }
  1300. .counter-sub {
  1301. font-size: 12px;
  1302. color: rgba(0,0,0,0.6);
  1303. margin-top: 2px;
  1304. }
  1305. .counter-controls {
  1306. display: flex;
  1307. align-items: center;
  1308. gap: 12px;
  1309. }
  1310. .counter-btn {
  1311. width: 40px;
  1312. height: 40px;
  1313. border-radius: 8px;
  1314. border: 1.5px solid #212121;
  1315. background: transparent;
  1316. color: #212121;
  1317. font-size: 20px;
  1318. font-weight: 600;
  1319. line-height: 1;
  1320. cursor: pointer;
  1321. transition: all 0.15s;
  1322. }
  1323. .counter-btn:hover:not(.disabled) {
  1324. background: rgba(0,0,0,0.06);
  1325. }
  1326. .counter-btn.disabled,
  1327. .counter-btn:disabled {
  1328. border-color: rgba(0,0,0,0.2);
  1329. color: rgba(0,0,0,0.25);
  1330. cursor: not-allowed;
  1331. background: transparent;
  1332. }
  1333. .counter-value {
  1334. min-width: 28px;
  1335. text-align: center;
  1336. font-size: 16px;
  1337. font-weight: 500;
  1338. color: #212121;
  1339. }
  1340. .capacity-warning {
  1341. margin-top: 12px;
  1342. padding: 10px 14px;
  1343. background: rgba(255,180,0,0.18);
  1344. border: 1px solid rgba(180,120,0,0.5);
  1345. border-radius: 6px;
  1346. color: #8a4500;
  1347. font-size: 14px;
  1348. }
  1350. /* ===========================================================
  1351. Calendrier
  1352. =========================================================== */
  1353. .calendar-container {
  1354. margin: 0 0 8px 0;
  1355. width: 100%;
  1356. display: flex;
  1357. justify-content: center;
  1358. }
  1359. #date_range_picker { display: none; }
  1360. .flatpickr-calendar.inline {
  1361. box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  1362. border-radius: 8px;
  1363. }
  1364. .flatpickr-day.booked {
  1365. background-color: #ff4444 !important;
  1366. color: white !important;
  1367. cursor: not-allowed !important;
  1368. position: relative;
  1369. }
  1370. .flatpickr-day.booked::after {
  1371. content: \"✕\";
  1372. position: absolute;
  1373. top: 50%; left: 50%;
  1374. transform: translate(-50%, -50%);
  1375. font-size: 20px;
  1376. font-weight: bold;
  1377. }
  1378. .flatpickr-day.booked:hover { background-color: #ff0000 !important; }
  1379. .flatpickr-day.available:hover { background-color: #28a745; color: white; }
  1381. @media (max-width: 768px) {
  1382. .booking-card { padding: 20px; }
  1383. .calendar-container { margin: 0 0 8px 0; padding: 0; }
  1384. .flatpickr-calendar.inline { width: 100% !important; max-width: 100% !important; }
  1385. .flatpickr-months { padding: 8px 10px; }
  1386. .flatpickr-days { width: 100% !important; }
  1387. .dayContainer {
  1388. width: 100% !important;
  1389. min-width: 100% !important;
  1390. max-width: 100% !important;
  1391. }
  1392. .flatpickr-day {
  1393. height: 40px !important;
  1394. line-height: 40px !important;
  1395. flex-basis: 14.2857% !important;
  1396. max-width: 14.2857% !important;
  1397. }
  1398. }
  1399. </style>
  1400. ";
  1402. $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  1405. $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  1407. yield from [];
  1408. }
  1410. /**
  1411. * @codeCoverageIgnore
  1412. */
  1413. public function getTemplateName(): string
  1414. {
  1415. return "vitrine/fr/homepage.html.twig";
  1416. }
  1418. /**
  1419. * @codeCoverageIgnore
  1420. */
  1421. public function isTraitable(): bool
  1422. {
  1423. return false;
  1424. }
  1426. /**
  1427. * @codeCoverageIgnore
  1428. */
  1429. public function getDebugInfo(): array
  1430. {
  1431. return array ( 1226 => 967, 1213 => 966, 1078 => 841, 920 => 686, 916 => 685, 913 => 684, 908 => 680, 895 => 679, 824 => 618, 820 => 617, 815 => 615, 811 => 614, 807 => 613, 803 => 612, 799 => 611, 794 => 610, 785 => 603, 782 => 602, 775 => 597, 768 => 593, 761 => 589, 754 => 585, 749 => 582, 743 => 577, 702 => 537, 683 => 519, 677 => 514, 672 => 511, 659 => 500, 657 => 499, 655 => 498, 445 => 289, 179 => 15, 166 => 14, 151 => 8, 138 => 7, 115 => 5, 92 => 4, 69 => 3, 46 => 1,);
  1432. }
  1434. public function getSourceContext(): Source
  1435. {
  1436. return new Source("{% extends 'vitrine/fr/layout.html.twig' %}
  1438. {% block title %}Suite Cathedrale Heritage - Location 8 pers Strasbourg Centre{% endblock title %}
  1439. {% block description %}Louez notre suite de 83m² au cœur de Strasbourg. 3 chambres, 8 personnes, à 100m de la Cathédrale. Cuisine équipée, 2 salles de bain. Réservez votre séjour!{% endblock description %}
  1440. {% block robots %}index,follow{% endblock robots %}
  1442. {% block canonical %}
  1443. <link rel=\"canonical\" href=\"https://cathedraleheritage.com/fr\" />
  1444. <link rel=\"alternate\" hreflang=\"fr\" href=\"https://cathedraleheritage.com/fr\" />
  1445. <link rel=\"alternate\" hreflang=\"en\" href=\"https://cathedraleheritage.com\" />
  1446. <link rel=\"alternate\" hreflang=\"x-default\" href=\"https://cathedraleheritage.com\" />
  1447. {% endblock canonical %}
  1449. {% block body %}
  1451. <section id=\"hero\" class=\"text-light no-top no-bottom relative overflow-hidden z-1000\">
  1452. <div class=\"abs w-100 abs-centered z-2\">
  1453. <div class=\"container\">
  1454. <div class=\"spacer-double\"></div>
  1456. <div class=\"row g-4 align-items-center justify-content-center\">
  1457. <div class=\"col-md-8 text-center\">
  1458. <h1 class=\"mb-2\" style=\"color:white;\">Bienvenue sur la Suite Cathédrale Héritage</h1>
  1459. <p class=\"lead mb-3\" style=\"color:white; font-size:22px;\">Appartement d'exception, pouvant accueillir jusqu'à 8 personnes au cœur du prestigieux centre historique de Strasbourg</p>
  1460. <a class=\"btn-main btn-line bg-blur fx-slide\" href=\"#about\" style=\"color:white;\"><span>Découverte</span></a>
  1461. </div>
  1462. </div>
  1463. </div>
  1464. </div>
  1465. <div class=\"vertical-center\">
  1466. <div class=\"swiper\">
  1467. <div class=\"swiper-wrapper\">
  1468. <div class=\"swiper-slide\">
  1469. <div class=\"swiper-inner\" data-bgimage=\"url(/images/salon2.jpeg)\">
  1470. <div class=\"sw-overlay op-5\"></div>
  1471. </div>
  1472. </div>
  1473. <div class=\"swiper-slide\">
  1474. <div class=\"swiper-inner\" data-bgimage=\"url(/images/chambre2.jpeg)\">
  1475. <div class=\"sw-overlay op-5\"></div>
  1476. </div>
  1477. </div>
  1478. <div class=\"swiper-slide\">
  1479. <div class=\"swiper-inner\" data-bgimage=\"url(/images/noel.jpeg)\">
  1480. <div class=\"sw-overlay op-5\"></div>
  1481. </div>
  1482. </div>
  1483. </div>
  1484. </div>
  1485. </div>
  1487. <div class=\"abs w-100 bottom-0 z-2 pb-4 sm-hide\">
  1488. <div class=\"container\">
  1489. <div class=\"row\">
  1490. <div class=\"col-lg-12\">
  1491. <div class=\"d-flex justify-content-between\">
  1492. <div>
  1493. <h6 style=\"color:white;\">Cathédrale à 100m</h6>
  1494. </div>
  1495. <div>
  1496. <h6 style=\"color:white;\">Musées à 200m</h6>
  1497. </div>
  1498. <div>
  1499. <h6 style=\"color:white;\">Petite France à 300m</h6>
  1500. </div>
  1501. </div>
  1502. </div>
  1503. </div>
  1504. </div>
  1505. </div>
  1506. <div class=\"gradient-edge-bottom op-8\"></div>
  1507. </section>
  1509. <section id=\"about\">
  1510. <div class=\"container\">
  1511. <div class=\"row g-4 align-items-end justify-content-between\">
  1512. <div class=\"col-lg-5\">
  1513. <div class=\"subtitle\">A propos de l'appartement</div>
  1514. <h2>Suite moderne en hyper centre de la grande île de Strasbourg</h2>
  1515. </div>
  1517. <div class=\"col-lg-4\">
  1518. <p class=\"mb-4\" style=\"color:#212121;\">
  1519. Logement spacieux idéal pour familles et groupes jusqu'à 8 personnes, comprenant deux chambres doubles dont une suite parentale avec une salle de bain, une chambre avec deux lits superposés doubles (4 couchages) maximum de 100kg pour les lits en hauteur.
  1520. </p>
  1521. <p class=\"mb-4\" style=\"color:#212121;\">
  1522. Cuisine entièrement équipée et salon-salle à manger convivial pour partager de bons moments ensemble.
  1523. </p>
  1524. <p class=\"mb-4\" style=\"color:#212121;\">
  1525. Équipements : sèche-cheveux, lave-vaisselle, lave-linge séchant, micro-ondes, four, planche à repasser avec fer, cafetière Nespresso, bouilloire, télévision, Wi-Fi et prises USB pour recharger vos appareils.
  1526. </p>
  1527. </div>
  1528. </div>
  1530. <div class=\"spacer-single\"></div>
  1532. <div class=\"row g-4\">
  1533. <div class=\"col-md-2\">
  1534. <div class=\"relative\">
  1535. <h5>Taille</h5>
  1536. <div class=\"d-flex justify-content-start align-items-center\" style=\"padding-top:6px;\">
  1537. <img src=\"/images/home.png\" width=\"37\" class=\"me-3\" alt=\"\">
  1538. <div class=\"fs-20 fw-600\" style=\"color:#212121;\">83 m²</div>
  1539. </div>
  1540. </div>
  1541. </div>
  1543. <div class=\"col-md-2\">
  1544. <div class=\"relative\">
  1545. <h5>Chambres</h5>
  1546. <div class=\"d-flex justify-content-start align-items-center\" style=\"padding-top:4px;\">
  1547. <img src=\"/images/bed.png\" width=\"37\" class=\"me-3\" alt=\"\">
  1548. <div class=\"fs-20 fw-600\" style=\"color:#212121;\">3</div>
  1549. </div>
  1550. </div>
  1551. </div>
  1553. <div class=\"col-md-2\">
  1554. <div class=\"relative\">
  1555. <h5>Salon</h5>
  1556. <div class=\"d-flex justify-content-start align-items-center\">
  1557. <img src=\"/images/sofa.png\" width=\"50\" class=\"me-3\" alt=\"\">
  1558. <div class=\"fs-20 fw-600\" style=\"color:#212121;\">Inclus</div>
  1559. </div>
  1560. </div>
  1561. </div>
  1563. <div class=\"col-md-2\">
  1564. <div class=\"relative\">
  1565. <h5>Cuisine</h5>
  1566. <div class=\"d-flex justify-content-start align-items-center\" style=\"padding-top:6px;\">
  1567. <img src=\"/images/cooking.png\" width=\"37\" class=\"me-3\" alt=\"\">
  1568. <div class=\"fs-20 fw-600\" style=\"color:#212121;\">Inclus</div>
  1569. </div>
  1570. </div>
  1571. </div>
  1573. <div class=\"col-md-2\">
  1574. <div class=\"relative\">
  1575. <h5>Salle de bain</h5>
  1576. <div class=\"d-flex justify-content-start align-items-center\" style=\"padding-top:4px;\">
  1577. <img src=\"/images/bathroom.png\" width=\"40\" class=\"me-3\" alt=\"\">
  1578. <div class=\"fs-20 fw-600\" style=\"color:#212121;\">2</div>
  1579. </div>
  1580. </div>
  1581. </div>
  1583. <div class=\"col-md-2\">
  1584. <div class=\"relative\">
  1585. <h5>Personnes</h5>
  1586. <div class=\"d-flex justify-content-start align-items-center\" style=\"padding-top:5px;\">
  1587. <img src=\"/images/user.png\" width=\"37\" class=\"me-3\" alt=\"\">
  1588. <div class=\"fs-20 fw-600\" style=\"color:#212121;\">8</div>
  1589. </div>
  1590. </div>
  1591. </div>
  1592. </div>
  1593. </div>
  1594. </section>
  1596. <section id=\"rooms\" class=\"p-0 overflow-hidden\">
  1598. <div class=\"container-fluid\">
  1599. <div class=\"row\">
  1600. <div class=\"col-lg-12\">
  1601. <div class=\"owl-custom-nav menu-float\" data-target=\"#room-carousel\">
  1602. <a class=\"btn-next\"></a>
  1603. <a class=\"btn-prev\"></a>
  1605. <div id=\"room-carousel\" class=\"owl-2-cols-center owl-carousel owl-theme\">
  1607. <div class=\"item\">
  1608. <div class=\"relative\">
  1609. <div class=\"overflow-hidden text-light\">
  1610. <div class=\"abs h-100 start-0 z-2 p-4\">
  1611. <h3 style=\"color:white;\">Salon</h3>
  1612. </div>
  1613. <img src=\"/images/salon2.jpeg\" class=\"w-100\" alt=\"Salon\">
  1614. </div>
  1615. </div>
  1616. </div>
  1618. <div class=\"item\">
  1619. <div class=\"relative\">
  1620. <div class=\"overflow-hidden text-light\">
  1621. <div class=\"abs h-100 start-1 z-2 p-4\">
  1622. <h3 style=\"color:white;\">Chambre 1</h3>
  1623. </div>
  1624. <img src=\"/images/chambre1.jpeg\" class=\"w-100\" alt=\"Chambre 1\">
  1625. </div>
  1626. </div>
  1627. </div>
  1629. <div class=\"item\">
  1630. <div class=\"relative\">
  1631. <div class=\"overflow-hidden text-light\">
  1632. <div class=\"abs h-100 start-2 z-2 p-4\">
  1633. <h3 style=\"color:white;\">Chambre 2</h3>
  1634. </div>
  1635. <img src=\"/images/chambre2.jpeg\" class=\"w-100\" alt=\"Chambre 2\">
  1636. </div>
  1637. </div>
  1638. </div>
  1640. <div class=\"item\">
  1641. <div class=\"relative\">
  1642. <div class=\"overflow-hidden text-light\">
  1643. <div class=\"abs h-100 start-3 z-2 p-4\">
  1644. <h3 style=\"color:white;\">Chambre 3</h3>
  1645. </div>
  1646. <img src=\"/images/chambre3.jpeg\" class=\"w-100\" alt=\"Chambre 3\">
  1647. </div>
  1648. </div>
  1649. </div>
  1651. <div class=\"item\">
  1652. <div class=\"relative\">
  1653. <div class=\"overflow-hidden text-light\">
  1654. <div class=\"abs h-100 start-4 z-2 p-4\">
  1655. <h3 style=\"color:white;\">Cuisine</h3>
  1656. </div>
  1657. <img src=\"/images/cuisine.jpeg\" class=\"w-100\" alt=\"Cuisine\">
  1658. </div>
  1659. </div>
  1660. </div>
  1662. <div class=\"item\">
  1663. <div class=\"relative\">
  1664. <div class=\"overflow-hidden text-light\">
  1665. <div class=\"abs h-100 start-5 z-2 p-4\">
  1666. <h3 style=\"color:white;\">Salle de bain</h3>
  1667. </div>
  1668. <img src=\"/images/salledebain.jpeg\" class=\"w-100\" alt=\"Salle de bain 1\">
  1669. </div>
  1670. </div>
  1671. </div>
  1673. <div class=\"item\">
  1674. <div class=\"relative\">
  1675. <div class=\"overflow-hidden text-light\">
  1676. <div class=\"abs h-100 start-6 z-2 p-4\">
  1677. <h3 style=\"color:white;\">Salle de bain 2</h3>
  1678. </div>
  1679. <img src=\"/images/salledebain2.jpeg\" class=\"w-100\" alt=\"Salle de bain 2\">
  1680. </div>
  1681. </div>
  1682. </div>
  1684. </div>
  1685. </div>
  1686. </div>
  1687. </div>
  1688. </div>
  1690. </section>
  1692. <section id=\"services\" class=\"overlay-dark-1\">
  1693. <div class=\"container\">
  1694. <div class=\"row g-4 justify-content-between\">
  1695. <div class=\"col-lg-5 relative z-3\">
  1696. <div class=\"me-lg-3\">
  1697. <div class=\"subtitle wow fadeInUp\" data-wow-delay=\".0s\">Votre séjour à Strasbourg</div>
  1698. <h2 class=\"wow fadeInUp\" data-wow-delay=\".2s\">Tarifs et services</h2>
  1699. <p style=\"color:#212121; font-size:18px;\">Une suite d'exception au cœur de Strasbourg, avec conciergerie dédiée pour vous accompagner tout au long de votre séjour.</p>
  1701. <p style=\"color:#212121; font-size:18px;\">Réservation minimum deux nuits.</p>
  1703. <a href=\"#reservation\" class=\"btn-main\" style=\"color:white;\">Réservation</a>
  1706. </div>
  1707. </div>
  1709. <div class=\"col-lg-6\" style=\"color:black;\">
  1710. <div class=\"spacer-single spacer-double\"></div>
  1711. <div class=\"row\">
  1712. <div class=\"col-md-6 wow fadeInUp\" data-wow-delay=\".2s\">
  1714. {#
  1715. <h5 class=\" mb-3\">Haute saison</h5>
  1716. <p class=\"fs-500\"><small>Du 1er juin au 30 septembre • 25 novembre au 05 janvier</small></p>
  1717. <ul class=\"ul-check fs-500\">
  1718. <li>960 € la nuit</li>
  1719. <li>10% de remise à partir de 7 nuits</li>
  1720. </ul>
  1722. <h5 class=\"mb-3 mt-4\">Hors Saison</h5>
  1723. #}
  1725. <ul class=\"ul-check fs-500\">
  1726. <li>à partir de 350€ la nuit </li>
  1727. <li>10% de remise à partir de 7 nuits</li>
  1728. </ul>
  1729. </div>
  1731. <div class=\"col-md-6 wow fadeInUp\" data-wow-delay=\".4s\">
  1732. <h5 class=\"mb-3\">Services optionnels</h5>
  1733. <ul class=\"ul-check fs-500\">
  1734. <li>Une place de parking : 24 €/jour ou 150 €/semaine</li>
  1735. <li>Ménage supplémentaire durant votre séjour : 60 euros</li>
  1736. <li>Apéro alsacien : sur commande</li>
  1737. <li>Atelier pour enfants, équipements bébé, chiens acceptés sur demande (les autres animaux ne sont malheureusement pas autorisés dans l'appartement), Décoration pour occasions spéciales,…</li>
  1738. </ul>
  1740. <div class=\"mt-4\">
  1741. <p class=\"fs-500\"><strong>Conciergerie sur place</strong><br>
  1742. <small>Mardi au samedi • 10h-18h45 <br /> Conciergerie privée sur demande selon disponibilité <br /> Sur devis (Correspond à 10% de la réservation)</small>
  1743. </p>
  1744. </div>
  1745. </div>
  1746. </div>
  1747. </div>
  1748. </div>
  1751. </div>
  1752. </section>
  1754. <section id=\"section-gallery\" class=\"relative\">
  1755. <div class=\"container relative z-2\" id=\"photos\">
  1756. <div class=\"row g-4 gx-5 justify-content-center\">
  1757. <div class=\"col-lg-6 text-center\">
  1758. <h2 class=\"wow fadeInUp\" data-wow-delay=\".2s\">Galerie de l'Appartement</h2>
  1759. <p class=\"wow fadeInUp\" data-wow-delay=\".3s\" style=\"color:#212121;\">Voici les images de l'appartement qui vous permettront de découvrir les différents espaces : chambres, salon, cuisine, salle de bain et extérieur.</p>
  1760. </div>
  1761. </div>
  1763. <div class=\"row\">
  1764. <div class=\"col-md-12 text-center\">
  1765. <ul id=\"filters\" class=\"wow fadeInUp\" data-wow-delay=\"0s\">
  1766. <li><a href=\"#\" data-filter=\"*\" class=\"selected\" style=\"color:#212121;\">Tout afficher</a></li>
  1767. <li><a href=\"#\" data-filter=\".chambre\" style=\"color:#212121;\">Chambres</a></li>
  1768. <li><a href=\"#\" data-filter=\".salon\" style=\"color:#212121;\">Salon</a></li>
  1769. <li><a href=\"#\" data-filter=\".cuisine\" style=\"color:#212121;\">Cuisine</a></li>
  1770. <li><a href=\"#\" data-filter=\".salledebain\" style=\"color:#212121;\">Salle de bain</a></li>
  1771. <li><a href=\"#\" data-filter=\".exterieur\" style=\"color:#212121;\">Extérieur</a></li>
  1772. </ul>
  1773. </div>
  1774. </div>
  1776. <div id=\"gallery\" class=\"row g-3 wow fadeInUp\" data-wow-delay=\".3s\">
  1778. <!-- Chambres -->
  1779. <div class=\"col-md-3 col-sm-6 col-12 item chambre\">
  1780. <a href=\"images/chambre1.jpeg\" class=\"image-popup d-block hover\">
  1781. <div class=\"relative overflow-hidden\">
  1782. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  1783. Voir
  1784. </div>
  1785. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  1786. <img src=\"images/chambre1.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Chambre\">
  1787. </div>
  1788. </a>
  1789. </div>
  1791. <div class=\"col-md-3 col-sm-6 col-12 item chambre\">
  1792. <a href=\"images/chambre2.jpeg\" class=\"image-popup d-block hover\">
  1793. <div class=\"relative overflow-hidden\">
  1794. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  1795. Voir
  1796. </div>
  1797. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  1798. <img src=\"images/chambre2.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Chambre 2\">
  1799. </div>
  1800. </a>
  1801. </div>
  1803. <div class=\"col-md-3 col-sm-6 col-12 item chambre\">
  1804. <a href=\"images/chambre3.jpeg\" class=\"image-popup d-block hover\">
  1805. <div class=\"relative overflow-hidden\">
  1806. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  1807. Voir
  1808. </div>
  1809. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  1810. <img src=\"images/chambre3.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Chambre 3\">
  1811. </div>
  1812. </a>
  1813. </div>
  1815. <!-- Salon -->
  1816. <div class=\"col-md-3 col-sm-6 col-12 item salon\">
  1817. <a href=\"images/salon.jpeg\" class=\"image-popup d-block hover\">
  1818. <div class=\"relative overflow-hidden\">
  1819. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  1820. Voir
  1821. </div>
  1822. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  1823. <img src=\"images/salon.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salon\">
  1824. </div>
  1825. </a>
  1826. </div>
  1828. <div class=\"col-md-3 col-sm-6 col-12 item salon\">
  1829. <a href=\"images/salon2.jpeg\" class=\"image-popup d-block hover\">
  1830. <div class=\"relative overflow-hidden\">
  1831. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  1832. Voir
  1833. </div>
  1834. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  1835. <img src=\"images/salon2.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salon 2\">
  1836. </div>
  1837. </a>
  1838. </div>
  1840. <div class=\"col-md-3 col-sm-6 col-12 item salon\">
  1841. <a href=\"images/salon3.jpeg\" class=\"image-popup d-block hover\">
  1842. <div class=\"relative overflow-hidden\">
  1843. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  1844. Voir
  1845. </div>
  1846. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  1847. <img src=\"images/salon3.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salon 3\">
  1848. </div>
  1849. </a>
  1850. </div>
  1852. <div class=\"col-md-3 col-sm-6 col-12 item salon\">
  1853. <a href=\"images/salon4.jpeg\" class=\"image-popup d-block hover\">
  1854. <div class=\"relative overflow-hidden\">
  1855. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  1856. Voir
  1857. </div>
  1858. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  1859. <img src=\"images/salon4.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salon 4\">
  1860. </div>
  1861. </a>
  1862. </div>
  1864. <div class=\"col-md-3 col-sm-6 col-12 item salon\">
  1865. <a href=\"images/salon5.jpeg\" class=\"image-popup d-block hover\">
  1866. <div class=\"relative overflow-hidden\">
  1867. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  1868. Voir
  1869. </div>
  1870. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  1871. <img src=\"images/salon5.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salon 5\">
  1872. </div>
  1873. </a>
  1874. </div>
  1876. <!-- Cuisine -->
  1877. <div class=\"col-md-3 col-sm-6 col-12 item cuisine\">
  1878. <a href=\"images/cuisine.jpeg\" class=\"image-popup d-block hover\">
  1879. <div class=\"relative overflow-hidden\">
  1880. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  1881. Voir
  1882. </div>
  1883. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  1884. <img src=\"images/cuisine.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Cuisine\">
  1885. </div>
  1886. </a>
  1887. </div>
  1889. <!-- Salle de bain -->
  1890. <div class=\"col-md-3 col-sm-6 col-12 item salledebain\">
  1891. <a href=\"images/salledebain.jpeg\" class=\"image-popup d-block hover\">
  1892. <div class=\"relative overflow-hidden\">
  1893. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  1894. Voir
  1895. </div>
  1896. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  1897. <img src=\"images/salledebain.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salle de bain\">
  1898. </div>
  1899. </a>
  1900. </div>
  1902. <div class=\"col-md-3 col-sm-6 col-12 item salledebain\">
  1903. <a href=\"images/salledebain2.jpeg\" class=\"image-popup d-block hover\">
  1904. <div class=\"relative overflow-hidden\">
  1905. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  1906. Voir
  1907. </div>
  1908. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  1909. <img src=\"images/salledebain2.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Salle de bain 2\">
  1910. </div>
  1911. </a>
  1912. </div>
  1914. <!-- Extérieur -->
  1915. <div class=\"col-md-3 col-sm-6 col-12 item exterieur\">
  1916. <a href=\"images/exterieur.jpeg\" class=\"image-popup d-block hover\">
  1917. <div class=\"relative overflow-hidden\">
  1918. <div class=\"absolute start-0 w-100 hover-op-1 p-5 abs-middle z-2 text-center text-white z-3\">
  1919. Voir
  1920. </div>
  1921. <div class=\"absolute start-0 w-100 h-100 overlay-dark-7 hover-op-1 z-2\"></div>
  1922. <img src=\"images/exterieur.jpeg\" class=\"w-100 hover-scale-1-2\" alt=\"Extérieur\">
  1923. </div>
  1924. </a>
  1925. </div>
  1927. </div>
  1929. </div>
  1930. </section>
  1932. {# =================================================== #}
  1933. {# ============ SECTION RÉSERVATION (refondue) ======= #}
  1934. {# =================================================== #}
  1935. <section id=\"reservation\" class=\"text-light\">
  1936. <div class=\"container\">
  1937. <div class=\"row g-4 justify-content-center\">
  1938. <div class=\"col-lg-6 text-center\">
  1939. <h2 class=\"wow fadeInUp\" data-wow-delay=\".2s\">Réservez votre séjour</h2>
  1940. </div>
  1941. </div>
  1943. <div class=\"row g-4 justify-content-center\">
  1944. <div class=\"col-lg-8\">
  1945. <div class=\"booking-card\">
  1946. {{ form_start(form) }}
  1948. {# ----- CALENDRIER ----- #}
  1949. <div class=\"calendar-container\" style=\"height:300px;\">
  1950. <input type=\"text\" id=\"date_range_picker\">
  1951. </div>
  1953. {# ----- DATES RÉCAP (juste sous le calendrier) ----- #}
  1954. <div class=\"row g-3 mt-2 dates-recap\">
  1955. <div class=\"col-4 text-center\">
  1956. <div class=\"recap-label\">Arrivée</div>
  1957. <div class=\"recap-value\" id=\"info-start\">-</div>
  1958. </div>
  1959. <div class=\"col-4 text-center\">
  1960. <div class=\"recap-label\">Départ</div>
  1961. <div class=\"recap-value\" id=\"info-end\">-</div>
  1962. </div>
  1963. <div class=\"col-4 text-center\">
  1964. <div class=\"recap-label\">Nuits</div>
  1965. <div class=\"recap-value\" id=\"info-nights\">-</div>
  1966. </div>
  1967. </div>
  1969. <hr class=\"booking-divider\">
  1971. {# ----- WIDGET COMPTEURS ----- #}
  1972. <h4 class=\"booking-title\">Indiquez le nombre d'hébergements et de personnes</h4>
  1974. <div class=\"counter-row\">
  1975. <div class=\"counter-label\">
  1976. <div class=\"counter-title\">Chambres</div>
  1977. <div class=\"counter-sub\">Selon le nombre de voyageurs</div>
  1978. </div>
  1979. <div class=\"counter-controls\">
  1980. <button type=\"button\" class=\"counter-btn\" data-action=\"dec\" data-target=\"rooms\">−</button>
  1981. <span class=\"counter-value\" id=\"cnt-rooms\">1</span>
  1982. <button type=\"button\" class=\"counter-btn\" data-action=\"inc\" data-target=\"rooms\">+</button>
  1983. </div>
  1984. </div>
  1986. <div class=\"counter-row\">
  1987. <div class=\"counter-label\">
  1988. <div class=\"counter-title\">Adultes</div>
  1989. </div>
  1990. <div class=\"counter-controls\">
  1991. <button type=\"button\" class=\"counter-btn\" data-action=\"dec\" data-target=\"adults\">−</button>
  1992. <span class=\"counter-value\" id=\"cnt-adults\">2</span>
  1993. <button type=\"button\" class=\"counter-btn\" data-action=\"inc\" data-target=\"adults\">+</button>
  1994. </div>
  1995. </div>
  1997. <div class=\"counter-row\">
  1998. <div class=\"counter-label\">
  1999. <div class=\"counter-title\">Enfants</div>
  2000. <div class=\"counter-sub\">1 - 17 ans</div>
  2001. </div>
  2002. <div class=\"counter-controls\">
  2003. <button type=\"button\" class=\"counter-btn\" data-action=\"dec\" data-target=\"children\">−</button>
  2004. <span class=\"counter-value\" id=\"cnt-children\">0</span>
  2005. <button type=\"button\" class=\"counter-btn\" data-action=\"inc\" data-target=\"children\">+</button>
  2006. </div>
  2007. </div>
  2009. <div id=\"capacity-warning\" class=\"capacity-warning\" style=\"display:none;\"></div>
  2011. {# ----- RÉSULTAT PRIX ----- #}
  2012. <div id=\"results\" class=\"mt-3\"></div>
  2014. <hr class=\"booking-divider\">
  2016. {# ----- INFOS PERSONNELLES ----- #}
  2017. <div class=\"row g-3\">
  2018. <div class=\"col-md-6\">
  2019. <label class=\"booking-label\">Nom</label>
  2020. {{ form_widget(form.lastname) }}
  2021. </div>
  2022. <div class=\"col-md-6\">
  2023. <label class=\"booking-label\">Prénom</label>
  2024. {{ form_widget(form.name) }}
  2025. </div>
  2026. <div class=\"col-md-12\">
  2027. <label class=\"booking-label\">Email</label>
  2028. {{ form_widget(form.email) }}
  2029. </div>
  2030. <div class=\"col-md-12\">
  2031. <label class=\"booking-label\">Message</label>
  2032. {{ form_widget(form.message) }}
  2033. </div>
  2034. </div>
  2036. {# ----- CGV + SUBMIT ----- #}
  2037. <div class=\"text-center mt-4 cgv-block\">
  2038. <input type=\"checkbox\" id=\"acceptCGV\"> J'accepte les <a href=\"{{ path('locale_cgv') }}\" target=\"_blank\" style=\"color:#212121; text-decoration:underline;\">CGV</a>
  2039. </div>
  2040. <div class=\"text-center mt-3\">
  2041. <button type=\"submit\" name=\"submit\" value=\"1\" class=\"btn-main\" style=\"color:white;\">Confirmer la réservation</button>
  2042. </div>
  2044. {# Champs cachés #}
  2045. {{ form_widget(form.start) }}
  2046. {{ form_widget(form.end) }}
  2047. {{ form_widget(form.rooms) }}
  2048. {{ form_widget(form.adults) }}
  2049. {{ form_widget(form.children) }}
  2050. {{ form_widget(form.persons) }}
  2052. {{ form_rest(form) }}
  2053. {{ form_end(form) }}
  2054. </div>
  2055. </div>
  2056. </div>
  2057. </div>
  2058. </section>
  2060. <section id=\"faq\" class=\"text-light\">
  2061. <div class=\"container\">
  2063. <div class=\"row g-4 justify-content-center\">
  2064. <div class=\"col-lg-6 text-center\">
  2065. <h2 class=\"wow fadeInUp\" data-wow-delay=\".2s\">FAQ</h2>
  2066. </div>
  2067. </div>
  2069. <div class=\"row g-4 justify-content-center\">
  2070. <div class=\"col-lg-6 text-left\" style=\"color:black !important;\">
  2072. <h3 style=\"margin-top:7px;\">Comment réserver le logement ?</h3>
  2074. <div>Vous pouvez réserver directement sur notre site et bientôt via les plateformes partenaires. Le paiement sécurisé confirme immédiatement votre réservation.</div>
  2076. <h3 style=\"margin-top:7px;\">Quels sont les horaires d'arrivée et de départ ?</h3>
  2077. <ul>
  2078. <li>Arrivée : à partir de 15h</li>
  2079. <li>Départ : avant 11h</li>
  2080. </ul>
  2082. <h3 style=\"margin-top:7px;\">Le logement est-il entièrement équipé ?</h3>
  2083. <div>Oui, le logement est entièrement meublé et équipé : cuisine, literie, serviettes, électroménager, Wi-Fi,…</div>
  2085. <h3 style=\"margin-top:7px;\">Y a-t-il un parking disponible ?</h3>
  2086. <div>Oui, un parking privatif est possible en option au prix de 24 euros les 24h ou 150 euros la semaine (7 nuits).</div>
  2088. <h3 style=\"margin-top:7px;\">Le logement est-il adapté aux enfants ?</h3>
  2089. <div>Oui, nous proposons certains équipements pour enfants (lit bébé, chaise haute, vaisselle adaptée) sur demande.</div>
  2091. <h3 style=\"margin-top:7px;\">Les animaux sont-ils acceptés ?</h3>
  2092. <div>Merci de nous contacter avant de réserver si vous souhaitez venir avec un animal, les chiens sont les seuls animaux acceptés, mais soumis à une demande préalable.</div>
  2094. <h3 style=\"margin-top:7px;\">Puis-je annuler ou modifier ma réservation ?</h3>
  2095. <div>Oui, nos conditions d'annulation sont précisées lors de la réservation. Remboursement de 85% du montant de la location si annulation plus d'un mois avant la date d'arrivée, puis 50 % remboursés si annulation entre 1 mois et 15 jours avant la date d'arrivée. Pas de remboursement si annulation moins de 15 jours avant la date d'arrivée.</div>
  2097. <h3 style=\"margin-top:7px;\">Le logement est-il accessible en transport public ?</h3>
  2098. <div>Oui, les principaux transports sont proches. La station de tram « Langstross, Grand'rue » est à moins de 100 mètres de l'appartement. La gare de Strasbourg est à 10 minutes à pieds.</div>
  2100. <h3 style=\"margin-top:7px;\">Y a-t-il des commerces ou restaurants à proximité ?</h3>
  2101. <div>Oui, vous trouverez supermarchés, cafés, restaurants et activités touristiques au pied de l'immeuble.</div>
  2103. <h3 style=\"margin-top:7px;\">Que faire en cas de problème pendant le séjour ?</h3>
  2104. <div>Nous restons disponibles 24h/24 par mail, pour toute urgence ou question concernant le logement, vous pouvez aussi nous joindre entre 9h et 20h par téléphone au 07 61 05 82 43 et nous sommes disponibles</div>
  2106. </div>
  2107. </div>
  2109. </div>
  2110. </section>
  2112. {% endblock body %}
  2114. {% block footerjs %}
  2115. <script src=\"https://cdn.jsdelivr.net/npm/flatpickr\"></script>
  2116. <script src=\"https://cdn.jsdelivr.net/npm/flatpickr/dist/l10n/fr.js\"></script>
  2118. {# Grille tarifaire exposée au JS #}
  2119. <script>
  2120. window.PRICING_MATRIX = {{ pricingMatrix|json_encode|raw }};
  2121. window.SIMULATION_URL = \"{{ path('locale_simulation_pricing', {'_locale': 'fr'}) }}\";
  2122. console.log('📋 Grille basse saison chargée :', window.PRICING_MATRIX);
  2123. console.log('🔗 URL simulation :', window.SIMULATION_URL);
  2124. </script>
  2126. <script>
  2127. // ===========================================================
  2128. // Logique chambres / adultes / enfants
  2129. //
  2130. // Configuration physique :
  2131. // - Chambre A : lit double → 2 personnes
  2132. // - Chambre B : lit double → 2 personnes
  2133. // - Chambre C : lits superposés → 4 personnes (adultes/enfants)
  2134. //
  2135. // Le nombre de chambres est DÉTERMINÉ automatiquement (pas de choix) :
  2136. //
  2137. // SANS ENFANTS :
  2138. // 1-2 ad → 1 ch
  2139. // 3-4 ad → 2 ch
  2140. // 5-8 ad → 3 ch
  2141. //
  2142. // AVEC ENFANTS :
  2143. // 1-2 ad → 2 ch (chambre A + chambre superposés)
  2144. // 3+ ad → 3 ch (A + B + chambre superposés)
  2145. //
  2146. // Contraintes : adults + children ≤ 8, children ≤ 4, adults ≥ 1
  2147. // ===========================================================
  2149. function roomsForCombo(adults, children) {
  2150. if (children > 0) {
  2151. return adults <= 2 ? 2 : 3;
  2152. }
  2153. if (adults <= 2) return 1;
  2154. if (adults <= 4) return 2;
  2155. return 3;
  2156. }
  2158. function canAddAdult(state) {
  2159. if (state.adults >= 8) return false;
  2160. return (state.adults + 1 + state.children) <= 8;
  2161. }
  2163. function canAddChild(state) {
  2164. if (state.children >= 4) return false;
  2165. return (state.adults + state.children + 1) <= 8;
  2166. }
  2168. const state = { rooms: 1, adults: 2, children: 0 };
  2170. function updateDisplay() {
  2171. // Le nombre de chambres est recalculé automatiquement à chaque update
  2172. state.rooms = roomsForCombo(state.adults, state.children);
  2174. \$('#cnt-rooms').text(state.rooms);
  2175. \$('#cnt-adults').text(state.adults);
  2176. \$('#cnt-children').text(state.children);
  2178. \$('#reservation_form_rooms').val(state.rooms);
  2179. \$('#reservation_form_adults').val(state.adults);
  2180. \$('#reservation_form_children').val(state.children);
  2181. \$('#reservation_form_persons').val(state.adults + state.children);
  2183. \$('.counter-btn').each(function() {
  2184. const target = \$(this).data('target');
  2185. const action = \$(this).data('action');
  2186. let disabled = false;
  2188. if (target === 'rooms') {
  2189. // Chambres = toujours verrouillé (déterminé par adultes/enfants)
  2190. disabled = true;
  2191. }
  2192. if (target === 'adults') {
  2193. if (action === 'dec' && state.adults <= 1) disabled = true;
  2194. if (action === 'inc' && !canAddAdult(state)) disabled = true;
  2195. }
  2196. if (target === 'children') {
  2197. if (action === 'dec' && state.children <= 0) disabled = true;
  2198. if (action === 'inc' && !canAddChild(state)) disabled = true;
  2199. }
  2201. \$(this).prop('disabled', disabled).toggleClass('disabled', disabled);
  2202. });
  2204. \$('#capacity-warning').hide();
  2205. }
  2207. \$(document).on('click', '.counter-btn', function() {
  2208. if (\$(this).prop('disabled')) return;
  2210. const target = \$(this).data('target');
  2211. const action = \$(this).data('action');
  2213. // Aucune action sur \"rooms\" (toujours désactivé)
  2215. if (target === 'adults') {
  2216. if (action === 'inc' && canAddAdult(state)) state.adults++;
  2217. if (action === 'dec' && state.adults > 1) state.adults--;
  2218. }
  2220. if (target === 'children') {
  2221. if (action === 'inc' && canAddChild(state)) state.children++;
  2222. if (action === 'dec' && state.children > 0) state.children--;
  2223. }
  2225. updateDisplay();
  2226. updateSimulation();
  2227. });
  2229. function updateSimulation() {
  2230. const start = \$(\"#reservation_form_start\").val();
  2231. const end = \$(\"#reservation_form_end\").val();
  2232. const persons = state.adults + state.children;
  2234. console.log('🔄 updateSimulation', { start, end, rooms: state.rooms, adults: state.adults, children: state.children });
  2236. if (!start || !end || persons < 1) {
  2237. \$(\"#results\").html('');
  2238. return;
  2239. }
  2241. \$(\"#results\").html('<div class=\"loading\" style=\"color:#212121;\">Calcul en cours...</div>');
  2243. \$.post(
  2244. window.SIMULATION_URL,
  2245. { start: start, end: end, rooms: state.rooms, adults: state.adults, children: state.children }
  2246. )
  2247. .done(function(data) {
  2248. console.log('✅ Simulation OK');
  2249. \$(\"#results\").html(data);
  2250. })
  2251. .fail(function(xhr) {
  2252. console.error('❌ Simulation KO', xhr.status, xhr.responseText);
  2253. \$(\"#results\").html('<div class=\"error\" style=\"color:#a00;\">Erreur lors du calcul du prix (' + xhr.status + ')</div>');
  2254. });
  2255. }
  2257. \$(document).ready(function() {
  2258. updateDisplay();
  2260. // Bouton submit désactivé tant que CGV non cochées
  2261. \$('button[type=\"submit\"]').prop('disabled', true);
  2262. \$('#acceptCGV').change(function() {
  2263. \$('button[type=\"submit\"]').prop('disabled', !\$(this).is(':checked'));
  2264. });
  2265. });
  2266. </script>
  2268. <script>
  2269. // ===========================================================
  2270. // Flatpickr calendrier
  2271. // ===========================================================
  2272. \$(document).ready(function() {
  2273. let bookedRanges = [];
  2275. \$.ajax({
  2276. url: '{{ env('WEBHOOK_CALENDAR_AVAILABILITY') }}',
  2277. method: 'POST',
  2278. contentType: 'application/json',
  2279. data: ''
  2280. })
  2281. .done(function(data) {
  2282. bookedRanges = data.bookings || [];
  2283. initDatePicker();
  2284. })
  2285. .fail(function() { initDatePicker(); });
  2287. function parseLocalDate(dateStr) {
  2288. const [year, month, day] = dateStr.split('-').map(Number);
  2289. return new Date(year, month - 1, day);
  2290. }
  2292. const isMobile = window.innerWidth <= 900;
  2294. function initDatePicker() {
  2295. flatpickr(\"#date_range_picker\", {
  2296. inline: true,
  2297. mode: \"range\",
  2298. locale: \"fr\",
  2299. minDate: new Date(new Date().setDate(new Date().getDate() + 1)),
  2300. dateFormat: \"Y-m-d\",
  2301. showMonths: isMobile ? 1 : 2,
  2303. disable: [
  2304. function(date) {
  2305. const checkDate = new Date(date);
  2306. checkDate.setHours(0, 0, 0, 0);
  2307. return bookedRanges.some(range => {
  2308. const start = parseLocalDate(range.start_date);
  2309. const end = parseLocalDate(range.end_date);
  2310. return checkDate >= start && checkDate <= end;
  2311. });
  2312. }
  2313. ],
  2315. onChange: function(selectedDates, dateStr, instance) {
  2316. if (selectedDates.length === 2) {
  2317. const start = selectedDates[0];
  2318. const end = selectedDates[1];
  2320. if (isRangeAvailable(start, end)) {
  2321. \$('#reservation_form_start').val(formatDate(start)).trigger('change');
  2322. \$('#reservation_form_end').val(formatDate(end)).trigger('change');
  2323. updateSelectedInfo(start, end);
  2324. updateSimulation();
  2325. } else {
  2326. alert('⚠️ Cette période contient des dates déjà réservées.');
  2327. instance.clear();
  2328. clearSymfonyFields();
  2329. hideSelectedInfo();
  2330. \$(\"#results\").html('');
  2331. }
  2332. } else {
  2333. clearSymfonyFields();
  2334. hideSelectedInfo();
  2335. \$(\"#results\").html('');
  2336. }
  2337. },
  2339. onDayCreate: function(dObj, dStr, fp, dayElem) {
  2340. const date = new Date(dayElem.dateObj);
  2341. date.setHours(0, 0, 0, 0);
  2342. const isBooked = bookedRanges.some(range => {
  2343. const start = parseLocalDate(range.start_date);
  2344. const end = parseLocalDate(range.end_date);
  2345. return date >= start && date <= end;
  2346. });
  2347. if (isBooked) {
  2348. dayElem.classList.add('booked');
  2349. dayElem.title = 'Date indisponible (réservée)';
  2350. } else if (date >= new Date()) {
  2351. dayElem.classList.add('available');
  2352. }
  2353. }
  2354. });
  2355. }
  2357. function isRangeAvailable(startDate, endDate) {
  2358. let currentDate = new Date(startDate);
  2359. currentDate.setHours(0, 0, 0, 0);
  2360. const endCheck = new Date(endDate);
  2361. endCheck.setHours(0, 0, 0, 0);
  2362. while (currentDate <= endCheck) {
  2363. const isBooked = bookedRanges.some(range => {
  2364. const start = parseLocalDate(range.start_date);
  2365. const end = parseLocalDate(range.end_date);
  2366. return currentDate >= start && currentDate <= end;
  2367. });
  2368. if (isBooked) return false;
  2369. currentDate.setDate(currentDate.getDate() + 1);
  2370. }
  2371. return true;
  2372. }
  2374. function updateSelectedInfo(start, end) {
  2375. const nights = Math.ceil((end - start) / (1000 * 60 * 60 * 24));
  2376. \$('#info-start').text(start.toLocaleDateString('fr-FR'));
  2377. \$('#info-end').text(end.toLocaleDateString('fr-FR'));
  2378. \$('#info-nights').text(`\${nights} nuit\${nights > 1 ? 's' : ''}`);
  2379. }
  2381. function hideSelectedInfo() {
  2382. \$('#info-start').text('-');
  2383. \$('#info-end').text('-');
  2384. \$('#info-nights').text('-');
  2385. }
  2387. function clearSymfonyFields() {
  2388. \$('#reservation_form_start').val('');
  2389. \$('#reservation_form_end').val('');
  2390. }
  2392. function formatDate(date) {
  2393. return date.getFullYear() + '-' +
  2394. String(date.getMonth() + 1).padStart(2, '0') + '-' +
  2395. String(date.getDate()).padStart(2, '0');
  2396. }
  2397. });
  2398. </script>
  2399. {% endblock footerjs %}
  2401. {% block css %}
  2402. <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css\">
  2403. <style>
  2404. /* ===========================================================
  2405. Booking card (border blanc, fond transparent, texte noir)
  2406. =========================================================== */
  2407. .booking-card {
  2408. background: transparent;
  2409. border: 2px solid white;
  2410. border-radius: 12px;
  2411. padding: 32px;
  2412. color: #212121;
  2413. }
  2414. .booking-title {
  2415. color: #212121;
  2416. font-weight: 700;
  2417. margin-bottom: 24px;
  2418. }
  2419. .booking-divider {
  2420. border-top: 1px solid rgba(0,0,0,0.15);
  2421. margin: 28px 0;
  2422. }
  2423. .booking-label {
  2424. color: #212121;
  2425. font-weight: 500;
  2426. margin-bottom: 6px;
  2427. display: block;
  2428. }
  2429. .booking-card input.form-control,
  2430. .booking-card textarea.form-control {
  2431. background: rgba(255,255,255,0.85) !important;
  2432. border: 1px solid rgba(0,0,0,0.2) !important;
  2433. color: #212121 !important;
  2434. }
  2435. .booking-card input.form-control::placeholder,
  2436. .booking-card textarea.form-control::placeholder {
  2437. color: rgba(0,0,0,0.4) !important;
  2438. }
  2439. .booking-card input.form-control:focus,
  2440. .booking-card textarea.form-control:focus {
  2441. border-color: #212121 !important;
  2442. box-shadow: 0 0 0 0.2rem rgba(0,0,0,0.08) !important;
  2443. }
  2445. .cgv-block { color: #212121; }
  2446. .cgv-block a { color: #212121; text-decoration: underline; }
  2448. /* ----- Dates récap ----- */
  2449. .dates-recap { color: #212121; }
  2450. .recap-label {
  2451. font-size: 13px;
  2452. text-transform: uppercase;
  2453. letter-spacing: 0.5px;
  2454. opacity: 0.7;
  2455. }
  2456. .recap-value {
  2457. font-size: 18px;
  2458. font-weight: 600;
  2459. margin-top: 4px;
  2460. }
  2462. /* ----- Widget compteurs ----- */
  2463. .counter-row {
  2464. display: flex;
  2465. justify-content: space-between;
  2466. align-items: center;
  2467. padding: 14px 0;
  2468. border-bottom: 1px solid rgba(0,0,0,0.1);
  2469. }
  2470. .counter-row:last-of-type { border-bottom: none; }
  2471. .counter-title {
  2472. font-size: 16px;
  2473. font-weight: 500;
  2474. color: #212121;
  2475. }
  2476. .counter-sub {
  2477. font-size: 12px;
  2478. color: rgba(0,0,0,0.6);
  2479. margin-top: 2px;
  2480. }
  2481. .counter-controls {
  2482. display: flex;
  2483. align-items: center;
  2484. gap: 12px;
  2485. }
  2486. .counter-btn {
  2487. width: 40px;
  2488. height: 40px;
  2489. border-radius: 8px;
  2490. border: 1.5px solid #212121;
  2491. background: transparent;
  2492. color: #212121;
  2493. font-size: 20px;
  2494. font-weight: 600;
  2495. line-height: 1;
  2496. cursor: pointer;
  2497. transition: all 0.15s;
  2498. }
  2499. .counter-btn:hover:not(.disabled) {
  2500. background: rgba(0,0,0,0.06);
  2501. }
  2502. .counter-btn.disabled,
  2503. .counter-btn:disabled {
  2504. border-color: rgba(0,0,0,0.2);
  2505. color: rgba(0,0,0,0.25);
  2506. cursor: not-allowed;
  2507. background: transparent;
  2508. }
  2509. .counter-value {
  2510. min-width: 28px;
  2511. text-align: center;
  2512. font-size: 16px;
  2513. font-weight: 500;
  2514. color: #212121;
  2515. }
  2516. .capacity-warning {
  2517. margin-top: 12px;
  2518. padding: 10px 14px;
  2519. background: rgba(255,180,0,0.18);
  2520. border: 1px solid rgba(180,120,0,0.5);
  2521. border-radius: 6px;
  2522. color: #8a4500;
  2523. font-size: 14px;
  2524. }
  2526. /* ===========================================================
  2527. Calendrier
  2528. =========================================================== */
  2529. .calendar-container {
  2530. margin: 0 0 8px 0;
  2531. width: 100%;
  2532. display: flex;
  2533. justify-content: center;
  2534. }
  2535. #date_range_picker { display: none; }
  2536. .flatpickr-calendar.inline {
  2537. box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  2538. border-radius: 8px;
  2539. }
  2540. .flatpickr-day.booked {
  2541. background-color: #ff4444 !important;
  2542. color: white !important;
  2543. cursor: not-allowed !important;
  2544. position: relative;
  2545. }
  2546. .flatpickr-day.booked::after {
  2547. content: \"✕\";
  2548. position: absolute;
  2549. top: 50%; left: 50%;
  2550. transform: translate(-50%, -50%);
  2551. font-size: 20px;
  2552. font-weight: bold;
  2553. }
  2554. .flatpickr-day.booked:hover { background-color: #ff0000 !important; }
  2555. .flatpickr-day.available:hover { background-color: #28a745; color: white; }
  2557. @media (max-width: 768px) {
  2558. .booking-card { padding: 20px; }
  2559. .calendar-container { margin: 0 0 8px 0; padding: 0; }
  2560. .flatpickr-calendar.inline { width: 100% !important; max-width: 100% !important; }
  2561. .flatpickr-months { padding: 8px 10px; }
  2562. .flatpickr-days { width: 100% !important; }
  2563. .dayContainer {
  2564. width: 100% !important;
  2565. min-width: 100% !important;
  2566. max-width: 100% !important;
  2567. }
  2568. .flatpickr-day {
  2569. height: 40px !important;
  2570. line-height: 40px !important;
  2571. flex-basis: 14.2857% !important;
  2572. max-width: 14.2857% !important;
  2573. }
  2574. }
  2575. </style>
  2576. {% endblock css %}
  2577. ", "vitrine/fr/homepage.html.twig", "/var/www/vhosts/mirtillostudio.com/ch.mirtillostudio.com/templates/vitrine/fr/homepage.html.twig");
  2578. }
  2579. }