templates/games/tdm/japon-jeu.html.twig line 1

Open in your IDE?
  1. {% set section = 'tdm' %}
  2. {% extends 'base.html.twig' %}
  3. {% block title %}Pitch - Tour du monde rebondissant - Japon{% endblock %}
  4. {% block body %}
  5. <div data-controller="tdm-pays">
  6. <div id="nav-header" class="nav-header">
  7. <div class="nav-header__breadcrumb">
  8. <nav aria-label="breadcrumb">
  9. <ol class="breadcrumb">
  10. <li class="breadcrumb-item"><a href="{{ path('tdm') }}" class="swup-link">Tour du monde rebondissant</a></li>
  11. <li class="breadcrumb-item"><a href="/jeux/tour-du-monde/japon" class="swup-link" data-swup-color="#C02E35">Japon</a></li>
  12. <li class="breadcrumb-item active" aria-current="page">Rébus</li>
  13. </ol>
  14. </nav>
  15. </div>
  16. </div>
  17. <div id="tdm-pays">
  18. <div id="tdm-game" class="japon">
  19. <a href="/jeux/tour-du-monde/japon" class="tdm-game-back swup-link" data-swup-color="#C02E35"></a>
  20. <div id="tdm-rebus">
  21. <h2>Rébus</h2>
  22. <div id="game-rebus-container">
  23. <div class="container">
  24. <div class="row">
  25. <div class="col-12 col-md-12">
  26. <div id="rebus-illus">
  27. {% include '_elements/image.html.twig' with {src: "/build/images/tdm/japon/rebus.png", mode: "width", lazy:true} %}
  28. </div>
  29. </div>
  30. <div class="col-12 col-md-12">
  31. <div id="rebus-reponses">
  32. <button id="rebus-btn-a" class="btn btn-primary btn-yellow">Je vais faire un <br aria-hidden="true" />parcours en 3 coups</button>
  33. <button id="rebus-btn-b" class="btn btn-primary btn-yellow">Je vais faire un golf <br aria-hidden="true" />avec mes amis</button>
  34. <button id="rebus-btn-c" class="btn btn-primary btn-yellow">Je vais faire un joli <br aria-hidden="true" />coup au golf</button>
  35. </div>
  36. </div>
  37. </div>
  38. </div>
  39. </div>
  40. </div>
  41. <a href="#" id="btn-tdm-rebus-help" class="btn-tdm-help" data-bs-toggle="modal" data-bs-target="#tdm-rebus-rules" data-no-swup><span>?</span></a>
  42. <div id="modal-buttons">
  43. <a href="#" id="btn-tdm-rebus-rules" data-bs-toggle="modal" data-bs-target="#tdm-rebus-rules" data-no-swup></a>
  44. <a href="#" id="btn-tdm-rebus-win" data-bs-toggle="modal" data-bs-target="#tdm-rebus-win" data-no-swup></a>
  45. </div>
  46. <div class="modal fade modal-tdm-game" id="tdm-rebus-rules" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  47. <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
  48. <div class="modal-content">
  49. <div class="modal-header">
  50. <h3>Comment ça marche&nbsp;?</h3>
  51. <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  52. </div>
  53. <div class="modal-body">
  54. <p>Devine le message codé à partir des images qui représentent chacune un son.</p>
  55. </div>
  56. <div class="modal-footer justify-content-end">
  57. <a href="#" class="btn btn-primary" data-no-swup data-bs-dismiss="modal" aria-label="Close">Commencer</a>
  58. </div>
  59. </div>
  60. </div>
  61. </div>
  62. <div class="modal fade modal-tdm-game" id="tdm-rebus-win" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  63. <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
  64. <div class="modal-content">
  65. <div class="modal-header">
  66. <h3>Bravo !</h3>
  67. <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  68. </div>
  69. <div class="modal-body">
  70. <p>Tu as réussi à deviner le message codé&nbsp;! <br />Continue sur cette lancée et poursuis l’aventure avec Pitchos dans son tour du monde rebondissant.</p>
  71. </div>
  72. <div class="modal-footer justify-content-between">
  73. <a class="btn btn-primary swup-link" href="/jeux/tour-du-monde/japon" data-swup-color="#C02E35">Retour à la carte postale</a>
  74. <a class="btn btn-primary swup-link" href="/jeux/tour-du-monde/australie" data-swup-color="#0A2065" id="btn-tdm-next">Je continue</a>
  75. </div>
  76. </div>
  77. </div>
  78. </div>
  79. </div>
  80. </div>
  81. </div>
  82. {% endblock %}