Previous version made GPDR-friendly

2025-08-18 16:06:37 +02:00
commit fa64b62d5a
357 changed files with 10137 additions and 0 deletions
--- a/src/_includes/layouts/base.njk
+++ b/src/_includes/layouts/base.njk
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html lang="en" class="no-js">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta name="google-site-verification" content="-haql21y-2aWWdYUVglG0kBA4yjCcyG6y8mAzTrZ-Eg" />
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <link rel="icon" href="{{ site.faviconPath }}" type="image/png" />
+  {% include "partials/global/meta-info.njk" %}
+  <script>document.documentElement.classList.remove('no-js');</script>
+  <link rel = "stylesheet" href="/vendor/css/leaflet.css"/>
+  <link rel = "stylesheet" href="/vendor/css/bootstrap.min.css"/>
+  <style>{% include "assets/css/global.css" %}</style>
+  {% block head %}
+  {% endblock %}
+</head>
+<body>
+  {% include "partials/global/site-head.njk" %}
+  {% block content %}
+  {% endblock content %}
+  {% include "partials/global/site-foot.njk" %}
+  {% block foot %}
+  {% endblock %}
+  <script type="text/javascript" src="/js/components/menu-toggle.js" async defer></script>
+  <script type="text/javascript" src="/js/components/search.js" async defer></script>
+  <script type="text/javascript" src="/vendor/js/bootstrap.min.js" async defer></script>
+  <script>
+    if ('serviceWorker' in navigator) {
+      window.addEventListener('load', () => {
+        navigator.serviceWorker.register('/service-worker.js');
+      });
+    }
+  </script>
+  <script> 
+    var $buoop = {required:{e:-4,f:-3,o:-3,s:-1,c:-3},insecure:true,api:2021.04 }; 
+    function $buo_f(){ 
+    var e = document.createElement("script"); 
+    e.src = "//browser-update.org/update.min.js"; 
+    document.body.appendChild(e);
+    };
+    try {document.addEventListener("DOMContentLoaded", $buo_f,false)}
+    catch(e){window.attachEvent("onload", $buo_f)}
+  </script>
+  <!-- Matomo -->
+  <script>
+    var _paq = window._paq = window._paq || [];
+    /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+    _paq.push(["setDoNotTrack", true]);
+    _paq.push(["disableCookies"]);
+    _paq.push(['trackPageView']);
+    _paq.push(['enableLinkTracking']);
+    (function() {
+      var u="https://analytics.astrolabe.coop/";
+      _paq.push(['setTrackerUrl', u+'matomo.php']);
+      _paq.push(['setSiteId', '1']);
+      var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+      g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+    })();
+  </script>
+  <noscript><p><img src="https://analytics.astrolabe.coop/matomo.php?idsite=1&amp;rec=1" style="border:0;" alt="" /></p></noscript>
+  <!-- End Matomo Code -->
+</body>
+</html>
--- a/src/_includes/layouts/contact.njk
+++ b/src/_includes/layouts/contact.njk
@@ -0,0 +1,11 @@
+{% extends 'layouts/base.njk' %}
+
+{% block content %}
+  <main id="main-content" tabindex="-1">
+    {% include "partials/components/meeting.njk" %}
+    {% include "partials/components/faq.njk" %}
+    {% include "partials/components/contact-form.njk" %}
+  </main>
+{% endblock %}
+
+{{ content | safe }}
--- a/src/_includes/layouts/home.njk
+++ b/src/_includes/layouts/home.njk
@@ -0,0 +1,19 @@
+{% extends 'layouts/base.njk' %}
+
+{# Set lists content #}
+{% set newsListHeading = newsHeading %}
+{% set newsListItems = collections.newsFeed %}
+{% set customersListItems = collections.customers %}
+{% set partnersListItems = collections.partners %}
+
+{% block content %}
+  <main id="main-content" class="home" tabindex="-1">
+    {% include "partials/components/intro.njk" %}
+    {% include "partials/components/meeting.njk" %}
+    {% include "partials/components/posts-list-home.njk" %}
+    {% include "partials/components/presentation.njk" %}
+    {% include "partials/components/customers.njk" %}
+    {% include "partials/components/contact-form.njk" %}
+    {% include "partials/components/partners.njk" %}
+  </main>
+{% endblock %}
--- a/src/_includes/layouts/member.njk
+++ b/src/_includes/layouts/member.njk
@@ -0,0 +1,70 @@
+{% extends 'layouts/base.njk' %}
+
+{% set title = name %}
+
+{% block content %}
+  <main id="main-content" tabindex="-1">
+    <section class="[ wrapper member ]">
+      <article>
+        <h1>{{ name }}</h1>
+        <p class="position">{{ position }}</p>
+        {% if positionInternal %}
+          <p>{{ positionInternal }}</p>
+        {% endif %}
+        <div class="[ member__wrapper ]">
+          <div class="member__info">
+            <img src="{{ profile }}" alt="photo de {{ name }}">
+            {% if personalSite %}
+              <p class="member-url">
+                <strong>site web :</strong>
+                <a href="{{ personalSite }}">{{ personalSite }}</a>
+              </p>
+            {% endif %}
+            <ul class="social-links">
+              <li><a href="{{ [url , "/contact/"] | join | url }}" title="Écrire à {{ name }}" class="member-contact-at"><span>@</span></a></li>
+              {% if socialMastodon %}
+                <li><a href="{{ socialMastodon }}" title="mastodon"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M16.956 18.293c3.007-.36 5.625-2.212 5.954-3.905.519-2.667.476-6.508.476-6.508 0-5.207-3.411-6.733-3.411-6.733C18.255.357 15.302.025 12.233 0h-.075c-3.068.025-6.02.357-7.74 1.147 0 0-3.41 1.526-3.41 6.733 0 .315-.003.647-.004.993-.005.96-.01 2.024.018 3.136.123 5.091.933 10.11 5.64 11.355 2.171.575 4.035.695 5.535.613 2.722-.151 4.25-.972 4.25-.972l-.09-1.974s-1.945.613-4.13.538c-2.163-.074-4.448-.233-4.798-2.89a5.448 5.448 0 01-.048-.745s2.124.519 4.816.642c1.647.076 3.19-.096 4.759-.283zm2.406-3.705V8.283c0-1.288-.328-2.312-.987-3.07-.68-.757-1.57-1.145-2.674-1.145-1.278 0-2.246.491-2.885 1.474l-.623 1.043-.622-1.043c-.64-.983-1.608-1.474-2.886-1.474-1.104 0-1.994.388-2.674 1.146-.659.757-.987 1.781-.987 3.07v6.303h2.498V8.47c0-1.29.543-1.945 1.628-1.945 1.2 0 1.802.777 1.802 2.312v3.35h2.483v-3.35c0-1.535.601-2.312 1.801-2.312 1.086 0 1.629.655 1.629 1.945v6.119h2.497z"/></svg></a></li>
+              {% endif %}
+              {% if socialTwitter %}
+                <li><a href="{{ socialTwitter }}" title="twitter"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M24 4.309a9.83 9.83 0 01-2.828.775 4.932 4.932 0 002.165-2.724 9.864 9.864 0 01-3.127 1.195A4.916 4.916 0 0016.616 2c-3.179 0-5.515 2.966-4.797 6.045A13.978 13.978 0 011.671 2.901a4.93 4.93 0 001.523 6.574 4.903 4.903 0 01-2.229-.616c-.054 2.281 1.581 4.415 3.949 4.89a4.935 4.935 0 01-2.224.084 4.928 4.928 0 004.6 3.419A9.9 9.9 0 010 19.292a13.94 13.94 0 007.548 2.212c9.142 0 14.307-7.721 13.995-14.646A10.025 10.025 0 0024 4.309z"/></svg></a></li>
+              {% endif %}
+              {% if socialLinkedin %}
+                <li><a href="{{ socialLinkedin }}" title="linkedin"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.98 2.5A2.49 2.49 0 012.5 5 2.49 2.49 0 01.02 2.5C.02 1.12 1.13 0 2.5 0a2.49 2.49 0 012.48 2.5zM5 7H0v16h5V7zm7.982 0H8.014v16h4.969v-8.399c0-4.67 6.029-5.052 6.029 0V23H24V12.869c0-7.88-8.922-7.593-11.018-3.714V7z"/></svg></a></li>
+              {% endif %}
+              {% if socialGithub %}
+                <li><a href="{{ socialGithub }}" title="github"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 0C5.374 0 0 5.373 0 12c0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23A11.509 11.509 0 0 1 12 5.803c1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576C20.566 21.797 24 17.3 24 12c0-6.627-5.373-12-12-12Z"/></svg></a></li>
+              {% endif %}
+              {% if socialInstagram %}
+                <li><a href="{{ socialInstagram }}" title="instagram"><svg width="29" height="29" fill="none" viewBox="0 0 29 29" xmlns="http://www.w3.org/2000/svg"><path d="M 9.9980469 3 C 6.1390469 3 3 6.1419531 3 10.001953 L 3 20.001953 C 3 23.860953 6.1419531 27 10.001953 27 L 20.001953 27 C 23.860953 27 27 23.858047 27 19.998047 L 27 9.9980469 C 27 6.1390469 23.858047 3 19.998047 3 L 9.9980469 3 z M 22 7 C 22.552 7 23 7.448 23 8 C 23 8.552 22.552 9 22 9 C 21.448 9 21 8.552 21 8 C 21 7.448 21.448 7 22 7 z M 15 9 C 18.309 9 21 11.691 21 15 C 21 18.309 18.309 21 15 21 C 11.691 21 9 18.309 9 15 C 9 11.691 11.691 9 15 9 z M 15 11 A 4 4 0 0 0 11 15 A 4 4 0 0 0 15 19 A 4 4 0 0 0 19 15 A 4 4 0 0 0 15 11 z"></path></svg></a></li>
+              {% endif %}
+              {% if socialBehance %}
+                <li><a href="{{ socialBehance }}" title="behance"><svg width="29" height="29" fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M22 7h-7v-2h7v2zm1.726 10c-.442 1.297-2.029 3-5.101 3-3.074 0-5.564-1.729-5.564-5.675 0-3.91 2.325-5.92 5.466-5.92 3.082 0 4.964 1.782 5.375 4.426.078.506.109 1.188.095 2.14h-8.027c.13 3.211 3.483 3.312 4.588 2.029h3.168zm-7.686-4h4.965c-.105-1.547-1.136-2.219-2.477-2.219-1.466 0-2.277.768-2.488 2.219zm-9.574 6.988h-6.466v-14.967h6.953c5.476.081 5.58 5.444 2.72 6.906 3.461 1.26 3.577 8.061-3.207 8.061zm-3.466-8.988h3.584c2.508 0 2.906-3-.312-3h-3.272v3zm3.391 3h-3.391v3.016h3.341c3.055 0 2.868-3.016.05-3.016z"/></svg></a></li>
+              {% endif %}
+            </ul>
+          </div>
+          <div class="member__bio">
+            {{ content | safe }}
+            {% if tags %}
+              <h2 class="font-base weight-mid mt-5">Mots-clés</h2>
+              <ul class="tag-list mt-3">
+                {% for item in tags %}
+                  <li class="tag-item">
+                    <a href="/equipe/{{ item }}/">{{ item }}</a>
+                  </li>
+                {% endfor %}
+              </ul>
+            {% endif %}
+          </div>
+        </div>
+      </article>
+      <a class="return-link" href="/equipe/">Voir tous les membres</a>
+    </section>
+    {% if emailSlug %}
+      {% set contactMember = emailSlug %}
+    {% elif url %}
+      {% set contactMember = url | replace("/members/","") | replace("-",".") %}
+    {% endif %}
+    {% set contactTitle = ["Écrire à ",name] | join %}
+    {% include "partials/components/contact-form.njk" %}
+  </main>
+{% endblock %}
--- a/src/_includes/layouts/page.njk
+++ b/src/_includes/layouts/page.njk
@@ -0,0 +1,12 @@
+{% extends 'layouts/base.njk' %}
+
+{% block content %}
+  <main id="main-content" tabindex="-1">
+    <article class="[ post ]">
+      <div class="[ post__body ] [ wrapper ]">
+        {{ content | safe }}
+      </div>
+    </article>
+    {% include "partials/components/contact-form.njk" %}
+  </main>
+{% endblock %}
--- a/src/_includes/layouts/post.njk
+++ b/src/_includes/layouts/post.njk
@@ -0,0 +1,20 @@
+{% extends 'layouts/base.njk' %}
+
+{% block content %}
+  <main id="main-content" tabindex="-1">
+    <article class="[ post wrapper ]">
+      <div class="[ post__body ]">
+        <h1>{{ title }}</h1>
+        <div class="post-info">
+          Publié le <strong>{{ date | dateFilter }}</strong>{%if author %} | {{ author }}{% endif %}
+        </div>
+        {% if illustration %}
+        <img class="post-pic" src="{{ illustration }}" alt="illustration de l'article">
+        {% endif %}
+        {{ content | safe }}
+        <a class="return-link" href="/posts/">Voir toute l'actualité</a>
+      </div>
+    </article>
+    {% include "partials/components/contact-form.njk" %}
+  </main>
+{% endblock %}
--- a/src/_includes/layouts/posts-events.njk
+++ b/src/_includes/layouts/posts-events.njk
@@ -0,0 +1,26 @@
+{% extends 'layouts/base.njk' %}
+
+{% set newsListItems = collections.events %}
+
+{% block content %}
+  <main id="main-content" class="posts" tabindex="-1">
+    <div class="[ wrapper ]">
+      <h1 class="[ member-list__heading ]">{{ pageHeading }}</h1>
+      <ul class="post-filter">
+        <li>
+          <a href="/posts/">Tout</a>
+        </li>
+        <li>
+          <a href="/posts-news/">Actualités</a>
+        </li>
+        <li class="active">
+          <a href="/posts-events/">Évènements</a>
+        </li>
+      </ul>
+    </div>
+    <section class="[ news-list wrapper ]">
+      {% include "partials/components/posts-list.njk" %}
+    </section>
+    {% include "partials/components/contact-form.njk" %}
+  </main>
+{% endblock %}
--- a/src/_includes/layouts/posts-news.njk
+++ b/src/_includes/layouts/posts-news.njk
@@ -0,0 +1,26 @@
+{% extends 'layouts/base.njk' %}
+
+{% set newsListItems = collections.news %}
+
+{% block content %}
+  <main id="main-content" class="posts" tabindex="-1">
+    <div class="[ wrapper ]">
+      <h1 class="[ member-list__heading ]">{{ pageHeading }}</h1>
+      <ul class="post-filter">
+        <li>
+          <a href="/posts/">Tout</a>
+        </li>
+        <li class="active">
+          <a href="/posts-news/">Actualités</a>
+        </li>
+        <li>
+          <a href="/posts-events/">Évènements</a>
+        </li>
+      </ul>
+    </div>
+    <section class="[ news-list wrapper ]">
+      {% include "partials/components/posts-list.njk" %}
+    </section>
+    {% include "partials/components/contact-form.njk" %}
+  </main>
+{% endblock %}
--- a/src/_includes/layouts/posts.njk
+++ b/src/_includes/layouts/posts.njk
@@ -0,0 +1,27 @@
+{% extends 'layouts/base.njk' %}
+
+{% set newsListItems = collections.posts %}
+
+{% block content %}
+  <main id="main-content" class="posts" tabindex="-1">
+    <div class="[ wrapper ]">
+      <h1 class="[ member-list__heading ]">{{ pageHeading }}</h1>
+      <ul class="post-filter">
+        <li class="active">
+          <a href="/posts/">Tout</a>
+        </li>
+        <li>
+          <a href="/posts-news/">Actualités</a>
+        </li>
+        <li>
+          <a href="/posts-events/">Évènements</a>
+        </li>
+      </ul>
+    </div>
+    <section class="[ news-list wrapper ]">
+      {% include "partials/components/posts-list.njk" %}
+    </section>
+    
+    {% include "partials/components/contact-form.njk" %}
+  </main>
+{% endblock %}
--- a/src/_includes/layouts/team.njk
+++ b/src/_includes/layouts/team.njk
@@ -0,0 +1,25 @@
+{% extends 'layouts/base.njk' %}
+
+{% set teamListItems = collections.members %}
+
+{% block content %}
+  <main id="main-content" tabindex="-1">
+    <div class="[ wrapper ]">
+      <h1 class="[ member-list__heading ]">{{ teamListHeading }}</h1>
+      {{ content | safe }}
+      <div class="search-bar">
+        <label for="site-search">Rechercher par mots-clés :</label>
+        <input type="search" id="searchInput" name="q" aria-label="Filtrer par mots-clés" oninput="doSearch()" placeholder="dev, linux, ...">
+      </div>
+      <ul class="tag-list mt-3" id="tagList">
+        {% for skill in collections.skillsList %}
+          <li class="tag-item visually-hidden"><a href="/equipe/{{ skill }}/">{{ skill }}</a></li>
+        {% endfor %}
+      </ul>
+    </div>
+    {% include "partials/components/member-list.njk" %}
+    {% include "partials/components/map.njk" %}
+    {% include "partials/components/contact-form.njk" %}
+  </main>
+
+{% endblock %}
--- a/src/_includes/macros/form.njk
+++ b/src/_includes/macros/form.njk
@@ -0,0 +1,181 @@
+{# ===================
+   Forms
+   =================== #}
+
+{% macro label( text, name ) %}
+  <label class="question__label" for="field-{{ name }}">{{ text }}</label>
+{% endmacro %}
+
+{% macro field( type, name, data ) %}
+  <br>
+  <input class="question__field"
+        type="{{ type }}"
+        name="{{ name }}"
+        id="field-{{ name }}"
+        {% if data.required %}required aria-required="true"{% endif %}
+        {% if data.placeholder %}placeholder="{{ data.placeholder }}"{% endif %}
+        {% if data.pattern %}pattern="{{ data.pattern }}"{% endif %}
+        {% if data.description %}aria-describedby="description-{{ name }}"{% endif %}
+        {% if data.autocomplete %}autocomplete="{{ data.autocomplete }}"{% endif %}
+        {% if data.autocorrect %}autocorrect="{{ data.autocorrect }}"{% endif %}
+        {% if data.spellcheck %}spellcheck="{{ data.spellcheck }}"{% endif %}
+        {% if data.autocapitalize %}autocapitalize="{{ data.autocapitalize }}"{% endif %}
+        >
+  {% if data.description %}
+    <br>
+    {{ description( name, data.description ) }}
+  {% endif %}
+{% endmacro %}
+
+{% macro confirm( text, name, data ) %}
+  <label for="field-{{ name }}" class="question--confirm">
+    <input class="question__field question__field--confirm"
+          type="checkbox"
+          name="{{ name }}"
+          id="field-{{ name }}"
+          value="1"
+          {% if data.required %}required aria-required="true"{% endif %}
+          {% if data.description %}aria-describedby="description-{{ name }}"{% endif %}
+          >
+    {{ text }}
+  </label>
+  {% if data.description %}
+    <br>
+    {{ description( name, data.description ) }}
+  {% endif %}
+{% endmacro %}
+
+{% macro select( name, options, data ) %}
+  <br>
+  <select id="field-{{ name }}"
+          name="{{ name }}"
+          {% if data.required %}required aria-required="true"{% endif %}
+          {% if data.multiple %}multiple{% endif %}
+          {% if data.description %}aria-describedby="description-{{ name }}"{% endif %}
+          >
+    {% for opt in data.options_before %}
+      {{ option( opt ) }}
+    {% endfor %}
+    {% for opt in options %}
+      {{ option( opt ) }}
+    {% endfor %}
+    {% for opt in data.options_after %}
+      {{ option( opt ) }}
+    {% endfor %}
+  </select>
+  {% if data.description %}
+    <br>
+    {{ description( name, data.description ) }}
+  {% endif %}
+{% endmacro %}
+
+{% macro option( data ) %}
+  {% if data.value %}
+    <option value="{{ data.value }}">{{ data.label }}</option>
+  {% else %}
+    <option>{{ data }}</option>
+  {% endif %}
+{% endmacro %}
+
+{% macro textarea( name, data ) %}
+  <br>
+  <textarea id="field-{{ name }}"
+            name="{{ name }}"
+            {% if data.rows %}rows="{{ data.rows }}"{% else %}rows="5"{% endif %}
+            cols="100"
+            {% if data.required %}required aria-required="true"{% endif %}
+            {% if data.autocorrect %}autocorrect="{{ data.autocorrect }}"{% endif %}
+            {% if data.spellcheck %}spellcheck="{{ data.spellcheck }}"{% endif %}
+            {% if data.autocapitalize %}autocapitalize="{{ data.autocapitalize }}"{% endif %}
+            {% if data.description %}aria-describedby="description-{{ name }}"{% endif %}
+            ></textarea>
+  {% if data.description %}
+    {{ description( name, data.description ) }}
+  {% endif %}
+{% endmacro %}
+
+{% macro radios( label, name, options, data ) %}
+  <fieldset>
+    <legend
+      {% if data.description %}aria-describedby="description-{{ name }}"{% endif %}
+      >{{ label }}</legend>
+    <ul class="field-list__field-group__list">
+      {% for option in options %}
+        <li>
+          {% if option.value %}
+            <label for="field-{{ name }}-{{ option.value }}">
+              <input type="radio"
+                    name="{{ name }}"
+                    id="field-{{ name }}-{{ option.value }}"
+                    value="{{ option.value }}"
+                    {% if option.note %}aria-describedby="description-{{ name }}-{{ option.value }}"{% endif %}
+                    >{{ option.label }}</label>
+          {% else %}
+            <label for="field-{{ name }}-{{ option }}">
+              <input type="radio"
+                    name="{{ name }}"
+                    id="field-{{ name }}-{{ option }}"
+                    value="{{ option }}"
+                    >{{ option }}</label>
+          {% endif %}
+          {% if option.note %}
+            <br>
+            {{ description( ( name + '-' + option.value ), option.note ) }}
+          {% endif %}
+        </li>
+      {% endfor %}
+    </ul>
+    {% if data.description %}
+      {{ description( name, data.description ) }}
+    {% endif %}
+  </fieldset>
+{% endmacro %}
+
+{% macro checkboxes( label, name, options, data ) %}
+  <fieldset>
+    <legend
+      {% if data.description %}aria-describedby="description-{{ name }}"{% endif %}
+      >{{ label }}</legend>
+    <ul class="field-list__field-group__list">
+      {% for option in options %}
+        <li>
+          {% if option.value %}
+            <label for="field-{{ name }}-{{ option.value }}">
+              <input type="checkbox"
+                    name="{{ name }}"
+                    id="field-{{ name }}-{{ option.value }}"
+                    value="{{ option.value }}"
+                    {% if option.note %}aria-describedby="description-{{ name }}-{{ option.value }}"{% endif %}
+                    >{{ option.label }}</label>
+          {% else %}
+            <label for="field-{{ name }}-{{ option }}">
+              <input type="checkbox"
+                    name="{{ name }}"
+                    id="field-{{ name }}-{{ option }}"
+                    value="{{ option }}"
+                    >{{ option }}</label>
+          {% endif %}
+          {% if option.note %}
+            <br>
+            {{ description( ( name + '-' + option.value ), option.note ) }}
+          {% endif %}
+        </li>
+      {% endfor %}
+    </ul>
+    {% if data.description %}
+      {{ description( name, data.description ) }}
+    {% endif %}
+  </fieldset>
+{% endmacro %}
+
+{% macro description( id, html ) %}
+  <em class="[ field-list__field-group__description ]" id="description-{{ id }}">{{ html | safe }}</em>
+{% endmacro %}
+
+{% macro hidden_field( name, value ) %}
+  <input type="hidden" name="{{ name }}" id="field-{{ name }}" value="{{ value }}">
+{% endmacro %}
+
+{% macro button( text ) %}
+  <button type="submit" class="[ btn btn-secondary ]">{{ text }}</button>
+{% endmacro %}
--- a/src/_includes/macros/site.njk
+++ b/src/_includes/macros/site.njk
@@ -0,0 +1,4 @@
+{# ========================
+   Site-specific Macros
+   ======================== #}
+
--- a/src/_includes/partials/components/contact-form.njk
+++ b/src/_includes/partials/components/contact-form.njk
@@ -0,0 +1,140 @@
+{% from "macros/form.njk" import label, field, select, option, textarea, checkboxes, button, hidden_field %}
+
+<section class="[ form-container ]">
+  {% if not removeWave %}
+    <svg aria-hidden="true" viewBox="0 0 1440 131" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="#fff" d="M0 0h1440v131H0z"/><path d="M0 4.643l40-2.326c40-2.5 120-6.888 200 11.67 80 18.735 160 60.854 240 74.894 80 14.04 160 0 240-16.365 80-16.54 160-34.968 240-28.08 80 7.152 160 39.619 240 39.75 80-.131 160-32.598 200-49.139l40-16.365V131H0V4.643z" fill="#D6F253"/></svg>
+  {% endif %}
+  <div class="[ inner-wrapper ]">
+    {% if not contactMember %}
+      <h2 id="contact-form" class="[ contact-heading ]">Nous contacter</h2>
+    {% elif contactTitle %}
+      <h2 id="contact-form" class="[ contact-heading ]">{{ contactTitle }}</h2>
+    {% endif %}
+    
+    <div class="form-messages" aria-live="polite"></div>
+    
+    <form name="contact" method="POST" action="/form/contact-form-handler.php" class="contact-form">
+      <ol class="[ field-list ]">
+        <li class="[ field-list__field-group ]">
+          {{ label("Nom", "namezzz") }}
+          {{ field( "text", "namezzz", { required: true, placeholder: "", autocomplete: "name", autocorrect: "off", autocapitalize: "off" } ) }}
+        </li>
+        <li class="[ field-list__field-group ]">
+          {{ label("Email", "emailzzz") }}
+          {{ field( "email", "emailzzz", { required: true, placeholder: "", autocomplete: "email" } ) }}
+        </li>
+        <li class="[ field-list__field-group ] [ full-width ]">
+          {{ label("Je vous contacte pour :", "select") }}
+          {% if contactMember %}
+            {{ select( "select", [ 
+              {label: "Obtenir un rendez-vous (décrivez votre projet en quelques lignes)", value: "option 1"},
+              {label: "Proposer une mission à un coopérateur", value: "option 3"}
+            ], { required: true, options_before: [""], options_after: ["Autre demande"] } ) }}
+          {% else %}
+            {{ select( "select", [ 
+              {label: "Obtenir un rendez-vous (décrivez votre projet en quelques lignes)", value: "option 1"},
+              {label: "Obtenir des précisions sur le statut d'entrepreneur salarié", value: "option 2"},
+              {label: "Proposer une mission à un coopérateur", value: "option 3"},
+              {label: "Proposer un partenariat", value: "option 4"}
+            ], { required: true, options_before: [""], options_after: ["Autre demande"] } ) }}
+          {% endif %}
+        </li>
+        <li class="[ field-list__field-group ] [ full-width ]">
+          {{ label("Votre message", "message") }}
+          {{ textarea( "message", { required: true, autocapitalize: "sentences", spellcheck: "true" } ) }}
+        </li>
+        {% if contactMember %}
+          {{ hidden_field('subscribe', '') }}
+        {% else %}
+          <li class="[ field-list__field-group ] [ full-width ]">
+            {{ checkboxes("", "subscribe", [ "Je souhaite être tenu au courant de l'actualité Astrolabe"], { description: "" } ) }}
+          </li>
+        {% endif %}
+        <!-- H o n e y p o t -->
+        <li aria-hidden="true">
+          <label class="ohnohoney" for="name"></label>
+          <input tabindex="-1" class="ohnohoney" autocomplete="off" type="text" id="name" name="name" placeholder="Your name here">
+        </li>
+        <li aria-hidden="true">
+          <label class="ohnohoney" for="email"></label>
+          <input tabindex="-1" class="ohnohoney" autocomplete="off" type="email" id="email" name="email" placeholder="Your e-mail here">
+        </li>
+
+        <div class="h-captcha" data-sitekey="b07c49fe-50ee-4432-af0a-96d675c6326a"></div>
+        <script src="https://js.hcaptcha.com/1/api.js" async defer></script>
+      </ol>
+      {% if contactMember %}
+        {{ hidden_field('contactTo', contactMember) }}
+      {% endif %}
+      {{ button("Envoyer") }}
+    </form>
+  </div>
+</section>
+
+<style>
+.form-messages {
+  margin-bottom: 1rem;
+}
+
+.form-messages .error {
+  color: #dc3545;
+  margin-bottom: 0.5rem;
+}
+
+.form-messages .success {
+  color: #28a745;
+}
+
+.field-error {
+  color: #dc3545;
+  font-size: 0.875rem;
+  margin-top: 0.25rem;
+}
+</style>
+
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+  const form = document.querySelector('.contact-form');
+  const messagesContainer = document.querySelector('.form-messages');
+
+  form.addEventListener('submit', async function(e) {
+    e.preventDefault();
+    
+    // Clean previous messages
+    messagesContainer.innerHTML = '';
+    
+    // Get form data
+    const formData = new FormData(form);
+
+    try {
+      const response = await fetch(form.action, {
+        method: 'POST',
+        body: formData
+      });
+
+      const data = await response.json();
+
+      if (data.success) {
+        // Display success message
+        messagesContainer.innerHTML = `<div class="success">${data.message}</div>`;
+        form.reset();
+        // Redirect to thank you page
+        window.location.href = '/thank-you/index.html';
+      } else {
+        // Display errors
+        const errorHtml = data.errors.map(error => 
+          `<div class="error">${error}</div>`
+        ).join('');
+        messagesContainer.innerHTML = errorHtml;
+        
+        // Scroll to error messages
+        messagesContainer.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
+      }
+    } catch (error) {
+      messagesContainer.innerHTML = `
+        <div class="error">Une erreur est survenue lors de l'envoi du formulaire. Veuillez réessayer.</div>
+      `;
+    }
+  });
+});
+</script>
--- a/src/_includes/partials/components/customers.njk
+++ b/src/_includes/partials/components/customers.njk
@@ -0,0 +1,16 @@
+<section class="[ partner ]">
+  <div class="[ wrapper ]">
+    <p class="[ partner__heading ]">{{ customersHeading }}</p>
+    {% if customersListItems.length %}
+    <ol class="[ partner__list ]">
+      {% for item in customersListItems %}
+      <li class="partner__list-item">
+        <a href="{{ item.data.url }}" title="{{ item.data.name }}" target="_blank" rel="noreferrer noopener">
+          <img src="{{ item.data.thumbnail }}" alt="logo de {{ item.data.name }}">
+        </a>
+      </li>
+      {% endfor %}
+    </ol>
+    {% endif %}
+  </div>
+</section>
--- a/src/_includes/partials/components/faq.njk
+++ b/src/_includes/partials/components/faq.njk
@@ -0,0 +1,24 @@
+<section class="[ faq ]">
+  {% if faq.items %}
+  <div class="[ inner-wrapper ]">
+    <h1 class="faq__heading">{{ faqHeading }}</h1>
+    {{ content | safe }}
+    <div class="accordion accordion-flush" id="accordionFlushExample">
+      {% for item in faq.items %}
+        <div class="accordion-item">
+          <h3 class="accordion-header" id="flush-heading{{ loop.index }}">
+            <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse{{ loop.index }}" aria-expanded="false" aria-controls="flush-collapse{{ loop.index }}">
+              {{ item.q }}
+            </button>
+          </h3>
+          <div id="flush-collapse{{ loop.index }}" class="accordion-collapse collapse" aria-labelledby="flush-heading{{ loop.index }}" data-bs-parent="#accordionFlushExample">
+            <div class="accordion-body">
+              {{ item.a | urlize | safe }}
+            </div>
+          </div>
+        </div>
+      {% endfor %}
+    </div>
+  </div>
+  {% endif %}
+</section>
--- a/src/_includes/partials/components/intro.njk
+++ b/src/_includes/partials/components/intro.njk
@@ -0,0 +1,13 @@
+<header class="[ intro ]">
+  <div class="[ wrapper ]">
+    <h1 class="[ intro__heading ]">{{ brandHeading }}</h1>
+    <svg viewBox="0 0 127 237" width="100%" height="100%" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M116.77 20.74c-.472-1.843-2.433-5.326-6.48-5.326h-4.283C105.395 6.814 98.249 0 89.533 0c-9.116 0-16.534 7.448-16.534 16.605v20.597L10.073 61.124a2.422 2.422 0 00-1.403 3.124c6.302 16.578 22.13 26.795 38.897 26.795 2.778 0 5.582-.315 8.375-.895 2.026.425 4.09.704 6.169.824v21.449a2.422 2.422 0 104.842 0V90.962a41.398 41.398 0 006.046-.8v22.259a2.422 2.422 0 104.843 0v-23.59c16.39-5.573 28.22-21.102 28.22-39.352V20.256h4.228c1.262 0 1.737 1.513 1.793 1.708a2.425 2.425 0 002.94 1.723 2.424 2.424 0 001.747-2.948zM32.478 82.973c-8.206-3.684-14.61-10.117-18.31-18.225l62.113-23.615c.013-.004.023-.013.034-.017.09-.036.173-.083.257-.128.058-.032.119-.058.174-.093.066-.044.124-.096.186-.146.06-.05.127-.095.184-.151.05-.05.092-.109.138-.162.054-.063.112-.124.159-.192.043-.065.077-.136.116-.203.037-.067.079-.131.11-.202.03-.07.05-.146.074-.22.024-.076.053-.15.07-.229.015-.065.019-.132.028-.199.013-.093.028-.187.03-.282l.003-.039V16.605c0-6.485 5.245-11.762 11.69-11.762 6.416 0 11.637 5.226 11.687 11.667v30.547H86.663a2.421 2.421 0 00-2.422 2.422c0 .023.007.043.007.068-.033 15.12-9.538 28.88-23.678 34.255-9.166 3.483-19.144 3.192-28.092-.828zm34.639 3.12c12.614-6.78 21.023-19.79 21.88-34.194h12.133c-1.194 18.255-15.785 32.903-34.013 34.195z" fill="#1E1E1E"/><path d="M89.53 20.256h4.464a2.421 2.421 0 100-4.842h-4.463a2.421 2.421 0 100 4.842zM123.897 194.561h-4.496V114.15a2.241 2.241 0 00-2.248-2.233H6.994c-1.24 0-2.248 1-2.248 2.233v80.411H2.498a2.242 2.242 0 00-2.248 2.234v37.971A2.242 2.242 0 002.498 237h121.399a2.243 2.243 0 002.249-2.234v-37.971a2.243 2.243 0 00-2.249-2.234zM9.243 116.384h105.662v78.177H9.243v-78.177zm112.406 116.149H4.746v-33.505H121.65v33.505z" fill="#1E1E1E"/><path d="M103.663 125.318h-83.18a2.242 2.242 0 00-2.249 2.234v55.841a2.241 2.241 0 002.248 2.233h83.181c1.241 0 2.248-1 2.248-2.233v-55.841a2.242 2.242 0 00-2.248-2.234zm-2.248 55.841H22.73v-51.373h78.685v51.373zM114.904 206.846h-13.488a2.242 2.242 0 00-2.248 2.234v13.401a2.242 2.242 0 002.248 2.234h13.488a2.243 2.243 0 002.249-2.234V209.08a2.243 2.243 0 00-2.249-2.234zm-2.248 13.402h-8.992v-8.935h8.992v8.935zM92.423 206.846h-13.49a2.242 2.242 0 00-2.247 2.234v13.401a2.242 2.242 0 002.248 2.234h13.489a2.242 2.242 0 002.248-2.234V209.08a2.242 2.242 0 00-2.248-2.234zm-2.248 13.402h-8.993v-8.935h8.993v8.935z" fill="#1E1E1E"/><path d="M78.934 134.253H27.227v4.467h51.707v-4.467zM63.197 143.187h-35.97v4.468h35.97v-4.468zM45.212 152.122H27.227v4.467h17.985v-4.467zM58.7 152.122h-8.993v4.467h8.992v-4.467z" fill="#111"/></svg>
+    <div class="btn-grp">
+      <a role="button" href="/comprendre-la-cae/" class="btn btn-secondary">Une CAE c'est quoi ?</a>
+      <a role="button" href="/nous-rejoindre/" class="btn btn-primary">Nous rejoindre
+        <svg width="18" height="14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17.602 5.823L12.05.376a1.357 1.357 0 00-1.875 0 1.295 1.295 0 000 1.84l3.278 3.235H1.326C.587 5.451 0 6.027 0 6.752s.587 1.302 1.326 1.302h12.127l-3.278 3.215a1.295 1.295 0 000 1.84 1.349 1.349 0 001.894 0l5.533-5.427c.246-.242.398-.576.398-.93 0-.353-.133-.687-.398-.93z" fill="#111"/></svg>
+      </a>
+      <a role="button" href="/posts/flyer-2023/" class="btn btn-secondary">Notre flyer 📄</a>
+    </div>
+  </div>
+</header>
--- a/src/_includes/partials/components/map.njk
+++ b/src/_includes/partials/components/map.njk
@@ -0,0 +1,50 @@
+<div class="[ wrapper ]">
+  <h2 class="mt-5 mb-2">Où sommes-nous ?</h2>
+</div>
+<div id = "map" style = "width: 100%; height: 500px; margin-bottom: 8rem;"></div>
+<script type="text/javascript" src="/vendor/js/leaflet.js"></script>
+<script>
+  // Creating map options
+  var mapOptions = {
+    center: [48.10494125597395, -1.6795760019626425],
+    zoom: 15
+  }
+  
+  // Creating a map object
+  var map = new L.map('map', mapOptions);
+
+  var iconMarker = L.icon({
+    iconUrl: '/images/marker-stroke.svg',
+    iconSize: [28, 40],
+    iconAnchor: [14, 40],
+    popupAnchor: [0, -40]
+  });
+
+  var iconMarkerAlt = L.icon({
+    iconUrl: '/images/astrolabe/marker-logo-alt.svg',
+    iconSize: [40, 40],
+    iconAnchor: [20, 40],
+    popupAnchor: [0, -40]
+  });
+
+  var members = {{ collections.membersLocations | dump | safe }};
+
+  var markerGroup = members.map( member => {
+    return new L.marker(member.location, {icon: iconMarker}).bindPopup('<a href="'+member.url+'/">'+member.name+'</a>');
+  });
+
+  var markerSiege = L.marker([48.10494125597395, -1.6795760019626425], {icon: iconMarkerAlt}).bindPopup('Siège Astrolabe CAE')
+  .openPopup();
+
+  markerGroup.push(markerSiege)
+
+  var featureGroup = L.featureGroup(markerGroup).addTo(map);
+
+  map.fitBounds(featureGroup.getBounds());
+
+  // Creating a Layer object
+  var layer = new L.TileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
+  
+  // Adding layer to the map
+  map.addLayer(layer);
+</script>
--- a/src/_includes/partials/components/meeting.njk
+++ b/src/_includes/partials/components/meeting.njk
@@ -0,0 +1,6 @@
+<section id="Meeting" class="[ meeting ]">
+  <a class="[ meeting__link btn btn-secondary ]" href="https://nuage.astrolabe.coop/apps/forms/embed/jiKKjDLEJZ7DEck3tacdRMX3" target="_blank">
+    Réunions d'information&nbsp;
+    <svg width="18" height="14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17.602 5.823L12.05.376a1.357 1.357 0 00-1.875 0 1.295 1.295 0 000 1.84l3.278 3.235H1.326C.587 5.451 0 6.027 0 6.752s.587 1.302 1.326 1.302h12.127l-3.278 3.215a1.295 1.295 0 000 1.84 1.349 1.349 0 001.894 0l5.533-5.427c.246-.242.398-.576.398-.93 0-.353-.133-.687-.398-.93z" fill="#FFF"></path></svg>
+  </a>
+</section>
--- a/src/_includes/partials/components/member-list-simple.njk
+++ b/src/_includes/partials/components/member-list-simple.njk
@@ -0,0 +1,20 @@
+<section class="[ member-list ]">
+  <div class="[ wrapper ]">
+    {% if teamListItems.length %}
+      <ol class="[ member-list__items ]" reversed>
+        {% for item in teamListItems %}
+            <li class="member-list__item">
+              <a href="{{ item.data.url }}/" class="">
+                <img src=" {{ item.data.profile }}" alt="photo de {{ item.data.name }}">
+                <span class="member-name btn btn-primary">{{ item.data.name }}</span>
+              </a>
+              <p>{{ item.data.position }}</p>
+              {% if item.data.positionInternal %}
+                <p>{{ item.data.positionInternal }}</p>
+              {% endif %}
+            </li>
+        {% endfor %}
+      </ol>
+    {% endif %}
+  </div>
+</section>
--- a/src/_includes/partials/components/member-list.njk
+++ b/src/_includes/partials/components/member-list.njk
@@ -0,0 +1,24 @@
+<section class="[ member-list ]">
+  <div class="[ wrapper ]">
+    {% if teamListItems.length %}
+      <ol class="[ member-list__items ]" reversed>
+        {% for item in teamListItems %}
+            <li class="member-list__item">
+              <a href="{{ item.data.url }}/" class="">
+                <img src=" {{ item.data.profile }}" alt="photo de {{ item.data.name }}">
+                <span class="member-name btn btn-primary">{{ item.data.name }}</span>
+              </a>
+              <p>{{ item.data.position }}</p>
+              {% if item.data.positionInternal %}
+                <p>{{ item.data.positionInternal }}</p>
+              {% endif %}
+            </li>
+        {% endfor %}
+        <li class="member-list__item info">
+          <p>Vous êtes porteur d’un projet entrepreneurial en numérique et nouvelles technologies ?</p>
+          <a role="button" href="/nous-rejoindre/" class="btn btn-secondary">Rejoignez-nous</a>
+        </li>
+      </ol>
+    {% endif %}
+  </div>
+</section>
--- a/src/_includes/partials/components/nav.njk
+++ b/src/_includes/partials/components/nav.njk
@@ -0,0 +1,26 @@
+{% if navigation.items %}
+  <nav id="menu" class="nav" aria-label="{{ariaLabel}}">
+    <ul class="[ nav__list ]">
+      {% for item in navigation.items %}
+        {% set relAttribute = '' %}
+        {% set currentAttribute = '' %}
+
+        {% if item.rel %}
+          {% set relAttribute = ' rel="' + item.rel + '"' %}
+        {% endif %}
+
+        {% if page.url == item.url %}
+          {% set currentAttribute = ' aria-current="page"' %}
+        {% endif %}
+
+        {% if page.url == item.url %}
+        <li class="nav__item active">
+        {% else %}
+        <li class="nav__item">
+        {% endif %}
+          <a href="{{ item.url | url }}" {{ relAttribute | safe }}{{ currentAttribute | safe }}>{{ item.text }}</a>
+        </li>
+      {% endfor %}
+    </ul>
+  </nav>
+{% endif %}
--- a/src/_includes/partials/components/partners.njk
+++ b/src/_includes/partials/components/partners.njk
@@ -0,0 +1,16 @@
+<section class="[ partner ]">
+  <div class="[ wrapper ]">
+    <p class="[ partner__heading ]">{{ partnersHeading }}</p>
+    {% if partnersListItems.length %}
+    <ol class="[ partner__list ]">
+      {% for item in partnersListItems %}
+      <li class="partner__list-item">
+        <a href="{{ item.data.url }}" title="{{ item.data.name }}" target="_blank" rel="noreferrer noopener">
+          <img src="{{ item.data.thumbnail }}" alt="logo de {{ item.data.name }}">
+        </a>
+      </li>
+      {% endfor %}
+    </ol>
+    {% endif %}
+  </div>
+</section>
--- a/src/_includes/partials/components/posts-list-home.njk
+++ b/src/_includes/partials/components/posts-list-home.njk
@@ -0,0 +1,10 @@
+<section class="[ news-list ]">
+  <svg aria-hidden="true" viewBox="0 0 1440 349" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="#282156" d="M1440 154H0v195h1440z"/><path d="M1440 54.078l-48 12.41c-48 12.41-144 37.23-240 45.53-96 7.989-192 .232-288-29.01C768 54.079 672 4.438 576 .327c-96-4.421-192 37.463-288 45.452-96 8.3-192-16.52-240-28.931L0 4.437V203h1440V54.078z" fill="#282156"/></svg>
+  <div class="[ wrapper ]">
+    <div class="news-list__inner">
+      <h2 class="[ news-list__heading ]">{{ newsListHeading }}</h2>
+      {% include "partials/components/posts-list.njk" %}
+      <a href="/posts/" class="return-link">Voir tout</a>
+    </div>
+  </div>
+</section>
--- a/src/_includes/partials/components/posts-list.njk
+++ b/src/_includes/partials/components/posts-list.njk
@@ -0,0 +1,28 @@
+{% if newsListItems.length %}
+  <ol class="[ news-list__items ]" reversed>
+    {% for item in newsListItems %}
+      {% if item.date.getTime() <= global.now %}
+        <li class="news-list__item {{ item.data.type }}">
+          <a href="{{ item.url | url }}" class="news-list__link" style="background-image: url({{ item.data.illustration }});">
+            {% if item.data.type == 'event' %}
+              <p class="news-list__item-type">Évènement</p>
+            {% else %}
+              <p class="news-list__item-type">Actualité</p>
+            {% endif %}
+            <h3 class="news-list__item-heading">{{ item.data.title }}</h3>
+            <p class="news-list__item-date">
+              {% if item.data.eventDate %}
+              <time datetime="{{ item.data.eventDate | w3DateFilter }}">{{ item.data.eventDate | dateFilter }}</time>
+              {% else %}
+              <time datetime="{{ item.date | w3DateFilter }}">{{ item.date | dateFilter }}</time>
+              {% endif %}
+              {% if item.data.eventTime %}
+              <time datetime="{{ item.data.eventTime }}">{{ item.data.eventTime }}</time>
+              {% endif %}
+            </p>
+          </a>
+        </li>
+      {% endif %}
+    {% endfor %}
+  </ol>
+{% endif %}
--- a/src/_includes/partials/components/presentation.njk
+++ b/src/_includes/partials/components/presentation.njk
@@ -0,0 +1,62 @@
+{% set profilePics = collections.profiles %}
+
+<section class="[ presentation ]">
+  <div class="[ wrapper ]">
+    <article>
+      <div class="content">
+        <h2>Qui sommes-nous ?</h2>
+        <p>
+          Astrolabe CAE est une scop spécialisée dans le développement de <strong>projets</strong> ou de prestation de <strong>services</strong> autour des métiers du <strong>numérique</strong>. 
+          Notre objectif est de favoriser l’<strong>autonomie</strong> et l’<strong>émancipation</strong> de nos membres sur un modèle d’économie sociale et <strong>solidaire</strong> (ESS).
+        </p>
+      </div>
+      <div class="side-info">
+        {# <figure> #}
+          <img src="/images/crew-join.svg" alt="équipage astrolabe" loading="lazy" style="width: 22rem;">
+        {# </figure> #}
+        <a role="button" href="/nous-rejoindre/" class="btn btn-primary">Nous rejoindre 
+          <svg width="18" height="14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17.602 5.823L12.05.376a1.357 1.357 0 00-1.875 0 1.295 1.295 0 000 1.84l3.278 3.235H1.326C.587 5.451 0 6.027 0 6.752s.587 1.302 1.326 1.302h12.127l-3.278 3.215a1.295 1.295 0 000 1.84 1.349 1.349 0 001.894 0l5.533-5.427c.246-.242.398-.576.398-.93 0-.353-.133-.687-.398-.93z" fill="#111"></path></svg>
+        </a>
+      </div>
+    </article>
+    <article>
+      <div class="content">
+        <h2>Communs numérique</h2>
+        <p>
+          Chez Astrolabe nous aimons et faisons la promotion du <a href="https://fr.wikipedia.org/wiki/Logiciel_libre" target="_blank" rel="noreferrer noopener">logiciel libre</a>. Nos sommes membres d’<a href="http://www.alliance-libre.org/" target="_blank" rel="noreferrer noopener">Alliance Libre</a>
+          et nous mettons nos documents et projets internes à disposition sur <a href="https://git.astrolabe.coop/explore/repos" target="_blank" rel="noreferrer noopener">notre instance Gitea</a>.
+        </p>
+      </div>
+      <div class="side-info">
+        <figure>
+          <img src="/images/gitea.svg" alt="logo Gitea" loading="lazy" width="100" height="100">
+        </figure>
+         <a role="button" href="https://git.astrolabe.coop/explore/repos" class="btn btn-primary btn-icon" target="_blank" rel="noreferrer noopener">Gitea</a>
+      </div>
+    </article>
+    <article>
+      <div class="content">
+        <h2>Des profils variés</h2>
+        <p>
+          Nos coopérateurs possèdent des compétences propres allant de développement linux embarqué au web design et créent ainsi la <b>pluralité</b> de nos prestations.
+          <br><br>
+          Nous sommes également <b>fournisseur de service SAAS</b> de la solution logicielle libre de gestion de CAE <a href="https://www.baloop-erp.fr/" target="_blank" rel="noreferrer noopener">Baloop</a>.
+          <br><br>
+          Nous sommes détenteur de l'<a href="https://www.astrolabe.coop/posts/agrement-cir-2024/" target="_blank" rel="noreferrer noopener">Agrément CIR</a> utile pour nos membres qui travaillent dans le domaine de la R&D.
+        </p>
+      </div>
+      <div class="side-info">
+        <ul class="profile-preview">
+          {% for profile in profilePics %}
+          <li>
+            <a href="{{ profile.data.url }}/" title="{{ profile.data.name }}">
+              <img src="{{ profile.data.profile }}" alt="photo de {{ profile.data.name }}">
+            </a>
+          </li>
+          {% endfor %}
+        </ul>
+        <a role="button" href="/equipe/" class="btn btn-primary">Voir l'équipe</a>
+      </div>
+    </article>
+  </div>
+</section>
--- a/src/_includes/partials/global/meta-info.njk
+++ b/src/_includes/partials/global/meta-info.njk
@@ -0,0 +1,42 @@
+{% set pageTitle = site.name + ' - ' + title %}
+{% set pageDesc = '' %}
+{% set siteTitle = site.name %}
+{% set currentUrl = site.url + page.url %}
+
+{% if metaTitle %}
+  {% set pageTitle = metaTitle %}
+{% endif %}
+
+{% if description %}
+  {% set pageDesc = description %}
+{% endif %}
+
+<title>{{ pageTitle }}</title>
+<link rel="canonical" href="{{ currentUrl }}" />
+<link rel="alternate" type="application/rss+xml" title="Astrolabe CAE's RSS Feed" href="/feed.xml" />
+
+<meta property="og:site_name" content="{{ siteTitle }}" />
+<meta property="og:title" content="{{ pageTitle }}" />
+<meta property="og:type" content="website" />
+<meta property="og:url" content="{{ currentUrl }}" />
+
+{% if site.authorHandle %}
+  <meta name="twitter:creator" content="@{{ site.authorHandle | replace('@', '') }}" />
+{% endif %}
+
+{% if description %}
+  <meta name="description" content="{{ description }}" />
+  <meta name="twitter:description" content="{{ description }}" />
+  <meta property="og:description" content="{{ description }}" />
+{% endif %}
+
+{% if socialImage %}  
+  <meta property="og:image" content="{{ socialImage }}" />
+  <meta name="twitter:image" content="{{ socialImage }}" />
+  <meta property="og:image:alt" content="Page image for {{ site.name }}" />
+  <meta name="twitter:image:alt" content="Page image for {{ site.name }}" />
+{% endif %}
+
+{% if site.paymentPointer %}
+  <meta name="monetization" content="{{ site.paymentPointer }}" />
+{% endif %}
--- a/src/_includes/partials/global/service-worker.js
+++ b/src/_includes/partials/global/service-worker.js
@@ -0,0 +1,96 @@
+const CACHE_KEYS = {
+  PRE_CACHE: `precache-${VERSION}`,
+  RUNTIME: `runtime-${VERSION}`
+};
+
+// URLS that we don’t want to end up in the cache
+const EXCLUDED_URLS = [
+  '/contact',
+  '/thank-you'
+];
+
+// URLS that we want to be cached when the worker is installed
+const PRE_CACHE_URLS = [
+  '/',
+  '/fonts/varela-round-v12-latin-regular.woff',
+  '/fonts/varela-v10-latin-regular.woff',
+  '/fonts/open-sans-v17-latin-300.woff',
+  '/fonts/open-sans-v17-latin-regular.woff',
+  '/fonts/open-sans-v17-latin-600.woff',
+  '/fonts/open-sans-v17-latin-700.woff'
+];
+
+// You might want to bypass a certain host
+const IGNORED_HOSTS = ['localhost', 'unpkg.com', ];
+
+/**
+ * Takes an array of strings and puts them in a named cache store
+ *
+ * @param {String} cacheName
+ * @param {Array} items=[]
+ */
+const addItemsToCache = function(cacheName, items = []) {
+  caches.open(cacheName).then(cache => cache.addAll(items));
+};
+
+self.addEventListener('install', evt => {
+  self.skipWaiting();
+
+  addItemsToCache(CACHE_KEYS.PRE_CACHE, PRE_CACHE_URLS);
+});
+
+self.addEventListener('activate', evt => {
+  // Look for any old caches that don't match our set and clear them out
+  evt.waitUntil(
+    caches
+      .keys()
+      .then(cacheNames => {
+        return cacheNames.filter(item => !Object.values(CACHE_KEYS).includes(item));
+      })
+      .then(itemsToDelete => {
+        return Promise.all(
+          itemsToDelete.map(item => {
+            return caches.delete(item);
+          })
+        );
+      })
+      .then(() => self.clients.claim())
+  );
+});
+
+self.addEventListener('fetch', evt => {
+  const {hostname} = new URL(evt.request.url);
+
+  // Check we don't want to ignore this host
+  if (IGNORED_HOSTS.indexOf(hostname) >= 0) {
+    return;
+  }
+
+  // Check we don't want to ignore this URL
+  if (EXCLUDED_URLS.some(page => evt.request.url.indexOf(page) > -1)) {
+    return;
+  }
+
+  evt.respondWith(
+    caches.match(evt.request).then(cachedResponse => {
+      // Item found in cache so return
+      if (cachedResponse) {
+        return cachedResponse;
+      }
+
+      // Nothing found so load up the request from the network
+      return caches.open(CACHE_KEYS.RUNTIME).then(cache => {
+        return fetch(evt.request)
+          .then(response => {
+            // Put the new response in cache and return it
+            return cache.put(evt.request, response.clone()).then(() => {
+              return response;
+            });
+          })
+          .catch(ex => {
+            return;
+          });
+      });
+    })
+  );
+});
--- a/src/_includes/partials/global/site-foot.njk
+++ b/src/_includes/partials/global/site-foot.njk
@@ -0,0 +1,32 @@
+<footer role="contentinfo" class="[ site-foot ]">
+  <div class="wrapper">
+    <div class="[ site-foot__inner ]">
+      <div class="">
+        <h3>Crédits</h3>
+        <p>Design et intégration : <a class="footer-link" href="{{site.designerHandle}}" target="_blank" rel="noreferrer noopener">{{site.designerName}}</a></p>
+        <p>Illustrations inspirées par : {{site.illustrators}}
+        <p>
+          Généré avec <a class="footer-link" href="https://www.11ty.dev/" target="_blank" rel="noreferrer noopener">Eleventy</a>, basé sur le starter kit <a class="footer-link" href="https://hylia.website/" target="_blank" rel="noreferrer noopener">Hylia</a>
+        </p>
+      </div>
+      <div class="">
+        <h3><a class="footer-link" href="{{site.url}}/mentions-legales/" title="Mentions légales">Mentions légales</a></h3>
+        <p><a class="footer-link" href="{{site.url}}/rgpd/" title="Protection des données">Protection des données</a></p>
+      </div>
+      <div class="">
+        <h3>Contact</h3>
+        <p>{{site.authorName}}</p>
+        <p>{{site.authorAddress}}<br>{{site.authorCity}}</p>
+        <div class="socials">
+          <a href="{{site.authorSocial.mastodon}}" class="social" title="Mastodon"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M16.956 18.293c3.007-.36 5.625-2.212 5.954-3.905.519-2.667.476-6.508.476-6.508 0-5.207-3.411-6.733-3.411-6.733C18.255.357 15.302.025 12.233 0h-.075c-3.068.025-6.02.357-7.74 1.147 0 0-3.41 1.526-3.41 6.733 0 .315-.003.647-.004.993-.005.96-.01 2.024.018 3.136.123 5.091.933 10.11 5.64 11.355 2.171.575 4.035.695 5.535.613 2.722-.151 4.25-.972 4.25-.972l-.09-1.974s-1.945.613-4.13.538c-2.163-.074-4.448-.233-4.798-2.89a5.448 5.448 0 01-.048-.745s2.124.519 4.816.642c1.647.076 3.19-.096 4.759-.283zm2.406-3.705V8.283c0-1.288-.328-2.312-.987-3.07-.68-.757-1.57-1.145-2.674-1.145-1.278 0-2.246.491-2.885 1.474l-.623 1.043-.622-1.043c-.64-.983-1.608-1.474-2.886-1.474-1.104 0-1.994.388-2.674 1.146-.659.757-.987 1.781-.987 3.07v6.303h2.498V8.47c0-1.29.543-1.945 1.628-1.945 1.2 0 1.802.777 1.802 2.312v3.35h2.483v-3.35c0-1.535.601-2.312 1.801-2.312 1.086 0 1.629.655 1.629 1.945v6.119h2.497z" fill="#fff"/></svg></a>
+          <a href="{{site.authorSocial.facebook}}" class="social" title="Facebook"><svg fill="#FFFFFF" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 48 48" width="24px" height="24px"><path d="M24,4C12.972,4,4,12.972,4,24c0,10.006,7.394,18.295,17,19.75V29h-4c-0.552,0-1-0.447-1-1v-3c0-0.553,0.448-1,1-1h4v-3.632	C21,15.617,23.427,13,27.834,13c1.786,0,3.195,0.124,3.254,0.129C31.604,13.175,32,13.607,32,14.125V17.5c0,0.553-0.448,1-1,1h-2	c-1.103,0-2,0.897-2,2V24h4c0.287,0,0.56,0.123,0.75,0.338c0.19,0.216,0.278,0.502,0.243,0.786l-0.375,3	C31.555,28.624,31.129,29,30.625,29H27v14.75c9.606-1.455,17-9.744,17-19.75C44,12.972,35.028,4,24,4z"/></svg></a>
+          <a href="{{site.authorSocial.linkedin}}" class="social" title="Linkedin"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.98 2.5A2.49 2.49 0 012.5 5 2.49 2.49 0 01.02 2.5C.02 1.12 1.13 0 2.5 0a2.49 2.49 0 012.48 2.5zM5 7H0v16h5V7zm7.982 0H8.014v16h4.969v-8.399c0-4.67 6.029-5.052 6.029 0V23H24V12.869c0-7.88-8.922-7.593-11.018-3.714V7z" fill="#fff"/></svg></a>
+          <a href="{{site.authorSocial.instagram}}" class="social" title="Instagram"><svg fill="#FFFFFF" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 50 50" width="24px" height="24px"><path d="M 16 3 C 8.83 3 3 8.83 3 16 L 3 34 C 3 41.17 8.83 47 16 47 L 34 47 C 41.17 47 47 41.17 47 34 L 47 16 C 47 8.83 41.17 3 34 3 L 16 3 z M 37 11 C 38.1 11 39 11.9 39 13 C 39 14.1 38.1 15 37 15 C 35.9 15 35 14.1 35 13 C 35 11.9 35.9 11 37 11 z M 25 14 C 31.07 14 36 18.93 36 25 C 36 31.07 31.07 36 25 36 C 18.93 36 14 31.07 14 25 C 14 18.93 18.93 14 25 14 z M 25 16 C 20.04 16 16 20.04 16 25 C 16 29.96 20.04 34 25 34 C 29.96 34 34 29.96 34 25 C 34 20.04 29.96 16 25 16 z"/></svg></a>
+          <a href="{{site.authorSocial.peertube}}" class="social" title="Peertube"><svg fill="#FFFFFF" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 50 50" width="24px" height="24px"><path d="M8.83,4.5l16.89,9.75L42.6,24,25.72,33.75,8.83,43.5V24l8.36,4.83,8.42,4.87V14.27l-8.42,4.87L8.83,24V4.5Z"/></g></svg></a>
+          <a href="{{site.authorSocial.youtube}}" class="social" title="Youtube"><svg fill="#FFFFFF" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="24px" height="24px"><path d="M44.9,14.5c-0.4-2.2-2.3-3.8-4.5-4.3C37.1,9.5,31,9,24.4,9c-6.6,0-12.8,0.5-16.1,1.2c-2.2,0.5-4.1,2-4.5,4.3C3.4,17,3,20.5,3,25s0.4,8,0.9,10.5c0.4,2.2,2.3,3.8,4.5,4.3c3.5,0.7,9.5,1.2,16.1,1.2s12.6-0.5,16.1-1.2c2.2-0.5,4.1-2,4.5-4.3c0.4-2.5,0.9-6.1,1-10.5C45.9,20.5,45.4,17,44.9,14.5z M19,32V18l12.2,7L19,32z"/></g></svg></a>
+          <a href="{{site.authorSocial.twitch}}" class="social" title="Twitch"><svg fill="#FFFFFF" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 50 50" width="24px" height="24px"><path d="M31.16,12.16v8.19h2.47V12.16Zm-7.75,0v8.19H26V12.16ZM14.11,4.5,7.23,11.34l0,25.12h8.3l0,7,7.06-7H28.2L40.77,24V4.5Zm1.42,2.89H38v15.2L32.55,28H26.94l-5.12,5.13V28H15.53Z"/></g></svg></a>
+          <a href="{{site.authorSocial.rss}}" class="social" title="RSS"><svg fill="#FFFFFF" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 50 50" width="24px" height="24px"><path class="a" d="M5.5,13.5729A28.9269,28.9269,0,0,1,34.4271,42.5v0H42.5a37,37,0,0,0-37-37Z"></path><path class="a" d="M29.7179,42.5h-7.4A16.818,16.818,0,0,0,5.5,25.6819v-7.4A24.2183,24.2183,0,0,1,29.7181,42.5Z"></path><circle class="a" cx="10.2459" cy="37.7549" r="4.7453"></circle>/svg></a>
+        </div>
+      </div>
+  </div>
+</footer>
--- a/src/_includes/partials/global/site-head.njk
+++ b/src/_includes/partials/global/site-head.njk
@@ -0,0 +1,18 @@
+<a class="skip-link" href="#main-content">Skip to content</a>
+<header role="banner" class="[ site-head ]">
+  <div class="wrapper">
+    <div class="[ site-head__inner ]">
+      <a href="/" class="[ site-head__site-name ]">
+        <span class="visually-hidden">{{ site.name }} - Home</span>
+        {% include "../../../images/astrolabe/astrolabe_logo.svg" %}
+      </a>
+      <button class="menu-toggle" onclick="menuToggle(this)" title="ouvrir / fermer le menu">
+        <svg id="icon-show" aria-hidden="true" width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13 10h12M6 16h19m-15 6h15" stroke="#111" stroke-width="2" stroke-linecap="round"/></svg>
+        <svg id="icon-close" aria-hidden="true" width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M25.5 7l-19 17m19 0L6.5 7" stroke="#111" stroke-width="2" stroke-linecap="round"/></svg>
+        <span class="menu-toggle__label">menu</span>
+      </button>
+      {% set ariaLabel = 'navigation' %}
+      {% include "partials/components/nav.njk" %}
+    </div>
+  </div>
+</header>