templates/front/homepage.html.twig line 1

  1. {% extends 'base.html.twig' %}
  2. {% block title %}{{ page_title }}{% endblock %}
  3. {% block meta %}
  4. <meta content="object" property="og:type">
  5. <meta content="Le Nautilus" property="og:site_name">
  6. <meta content="Tiers-lieu culturel à Perpignan" property="og:title">
  7. <meta content="description du Tiers-lieu culturel à Perpignan" property="og:description">
  8. <meta content="https://dev.le-nautilus.org/images/default.jpg" property="og:image">
  9. <meta content="64" property="og:image:width">
  10. <meta content="64" property="og:image:height">
  11. <meta content="https://dev.nautilus.org" property="og:url">
  12. <meta content="summary" property="twitter:card">
  13. <meta content="Tiers-lieu culturel à Perpignan" property="twitter:title">
  14. <meta content="description du Tiers-lieu culturel à Perpignan" property="twitter:description">
  15. <meta content="https://dev.le-nautilus.org/images/default.jpg" property="twitter:image">
  16. <meta content="description du Nautilus, Tiers-lieu culturel à Perpignan" name="description">
  17. {% endblock %}
  18. {% block body %}
  19. <section id="intro" class="py-3">
  20.     <div class="container h-100">
  21.         <div class="row h-100 align-items-center">
  22.             <div class="col-12 col-md-6 pb-md-0 pb-3">
  23.                 <div class="front-page-heading text-center text-md-start">
  24.                     <h1><strong>Tiers-lieu culturel</strong><br>à Perpignan</h1>
  25.                     <p>Une ancienne discothèque emblématique du quartier Saint-Martin réhabilitée pour les acteurs associatifs, culturels et économiques de la région.</p>
  26.                     <p>Des <strong>espaces de coworking modulables</strong> permettant de se retrouver pour travailler, discuter, se former, et partager des projets collectifs dans un écosystème dédié.</p>
  27.                     <a class="btn btn-primary" href="#service">Embarquez à bord du Nautilus</a>
  28.                 </div>
  29.             </div>
  30.             <div class="col-12 col-md-6">
  31.                 <img src="/images/illustrations/le-nautilus-accueil-illustration.jpg" class="img-fluid rounded-4" alt="...">
  32.             </div>
  33.         </div>
  34.     </div>
  35. </section>
  36. <section id="service" class="py-5" style="background-color:#CFF4FC;">
  37.     <div class="container">
  38.         <div class="section-heading text-center">
  39.             <h2>du <strong>coworking</strong> et des événements</h2>
  40.             <p class="mt-3 mb-5">description de la section</p>
  41.         </div>
  42.         <div class="row section-content">
  43.             <div class="col-12 col-md-4 pb-4">
  44.                 <div class="card h-100">
  45.                     <div class="card-body text-center">
  46.                         <h3>coworking</h3>
  47.                         <p class-"card-text">Un openspace pour initier et encourager des dynamiques de travail en groupe ou en solo...</p>
  48.                         <a href="{{ path('coworking') }}" class="btn btn-primary">en savoir plus</a>
  49.                     </div>
  50.                 </div>
  51.             </div>
  52.             <div class="col-12 col-md-4 pb-4">
  53.                 <div class="card h-100">
  54.                     <div class="card-body text-center">
  55.                         <h3>espaces</h3>
  56.                         <p class-"card-text">Des espaces modulaires en fonction des besoins des adhérents et des voyageurs, nous adaptons les espaces pour un atelier Yoga, un salon de massage, un espace de réunion, un karaoké, un local de répétition</p>
  57.                         <a href="{{ path('space') }}" class="btn btn-primary">en savoir plus</a>
  58.                     </div>
  59.                 </div>
  60.             </div>
  61.             <div class="col-12 col-md-4 pb-4">
  62.                 <div class="card h-100">
  63.                     <div class="card-body text-center">
  64.                         <h3>événements</h3>
  65.                         <p class-"card-text">description</p>
  66.                         <a href="{{ path('local_event') }}" class="btn btn-primary">en savoir plus</a>
  67.                     </div>
  68.                 </div>
  69.             </div>
  70.         </div>
  71.     </div>
  72. </section>
  73. <section id="newsletter" class="py-5">
  74.     <div class="container">
  75.         <div class="row">
  76.             <div class="col-12 col-md-6">
  77.                 <div class="section-heading text-center text-md-start">
  78.                     <h2><strong>Restez informé</strong><br>grâce à la newsletter du Nautilus</h2>
  79.                     <p>description de la section</p>
  80.                 </div>
  81.             </div>
  82.             <div class="col-12 col-md-6">
  83.                 {{ form_start(form) }}
  84.                 <div class="section-newsletter-content px-5">
  85.                     <div class="row">
  86.                         <div class="col-12">
  87.                             <div class="form-floating mb-3">
  88.                                 {{ form_widget(form.firstname) }}
  89.                                 {{ form_label(form.firstname) }}
  90.                             </div>
  91.                         </div>
  92.                         <div class="col-12">
  93.                             <div class="form-floating mb-3">
  94.                                 {{ form_widget(form.lastname) }}
  95.                                 {{ form_label(form.lastname) }}
  96.                             </div>
  97.                         </div>
  98.                         <div class="col-12">
  99.                             <div class="form-floating mb-3">
  100.                                 {{ form_widget(form.email) }}
  101.                                 {{ form_label(form.email) }}
  102.                             </div>
  103.                         </div>
  104.                         <div class="col-12">
  105.                             <div class="mb-3">
  106.                                 <button class="btn btn-lg btn-primary w-100">je m'inscris</button>
  107.                             </div>
  108.                         </div>
  109.                     </div>
  110.                 </div>
  111.                 <div class="my-2 px-5">
  112.                 {% for message in app.flashes('success') %}
  113.                     <div class="alert alert-success">
  114.                         {{ message }}
  115.                     </div>
  116.                 {% endfor %}
  117.                 {% for message in app.flashes('warning') %}
  118.                     <div class="alert alert-warning">
  119.                         {{ message }}
  120.                     </div>
  121.                 {% endfor %}
  122.                 </div>
  123.                 {{ form_end(form) }}
  124.             </div>
  125.         </div>
  126.     </div>
  127. </section>
  128. {% endblock %}