Mise à jour des mentions légales.

Aussi, une nouvelle page décrit l'association, et sert d'introduction
avant de proposer l'adhésion.

assets/production/css/style.css

@@ -15,6 +15,10 @@ body {
   padding: 0 32px;
 }
 
+a {
+  color: #373d3f;
+}
+
 h1,
 h2,
 h3,
@@ -49,6 +53,14 @@ h5 {
   margin-bottom: 8px;
 }
 
+h3 a {
+  text-decoration: none;
+}
+
+h3 a:hover {
+  text-decoration: underline;
+}
+
 p + h5 {
   margin-top: 32px;
 }
@@ -87,8 +99,8 @@ abbr {
   text-align: center;
 }
 
-.mt192 {
-  margin-top: 192px;
+.mt128 {
+  margin-top: 128px;
 }
 
 .mt64 {
@@ -103,9 +115,9 @@ abbr {
   margin-bottom: 64px;
 }
 
-.Logo {
+.logo-front {
   display: block;
-  margin: 6em auto 0;
+  margin: 10em auto 0;
   height: 25vh;
 }
 
@@ -121,7 +133,7 @@ menu {
   font-size: 0;
 }
 
-.LogoContainer,
+.container-logo,
 .menu-item {
   height: 30%;
   display: inline-block;
@@ -238,7 +250,6 @@ menu {
 }
 
 .footer {
-  padding: 64px 0;
 }
 
 .footer ul,

content/association.md

@@ -0,0 +1,17 @@
+---
+permalink: false
+title: L'association
+---
+L'association **Ti Nuage** est née de la volonté de proposer dans le Trégor des services en ligne indépendants et d'assister les personnes qui d'interrogent sur le poids des activités numériques sur nos vies. Son objet est :
+
+- de mettre à disposition des services en ligne basés sur des logiciels libres, garantissant la confidentialité des données des utilisateurs, et d'héberger ces données dans le Trégor ;
+- de sensibiliser les utilisateurs à la protection de leur vie privée sur Internet ;
+- de promouvoir l'utilisation de logiciels libres ;
+- d'organiser des événements sur ces thèmes et de former à l'utilisation des technologies de l'information et de la communication ;
+- d'utiliser et promouvoir une informatique peu consommatrice en énergie.
+
+Pour remplir ces objectifs, l'association fournit des services en ligne libres et respectueux de l'utilisateur. Elle organise aussi des rencontres régulières pour discuter des thèmes qu'elle promeut, découvrir les besoins des communautés du Trégor, répondre aux questions des usagers.
+
+Adhérer à l'association permet de profiter de services particuliers (adresse de courriel, hébergement de site Web, ou compte personnel sur la plateforme de production et de collaboration NextCloud) et de participer à cette dynamique. Chaque adhérent possède une voix et peut apporter son aide et ses idées sur toutes les activités de l'association.
+
+Les modalités d'inscription se trouvent [sur le Wiki](https://wiki.ti-nuage.fr/fr/Association/Adhésion).

content/index.html

@@ -3,46 +3,46 @@ layout: front.njk
 hidemenuicon: true
 title: L'hébergeur associatif, transparent et solidaire
 ---
-<img class="Logo" src="/images/logo.svg" alt="">
+<img class="logo-front" src="/images/logo.svg" alt="">
 <header class="Hero">
   <h1 class="tac">Hébergeur associatif, transparent, éthique, militant et solidaire. </h1>
-  <div class="tac mt32">
-    <a class="Button" href="https://www.helloasso.com/associations/ti-nuage/adhesions/adhesion-1">Devenir adhérent</a>
-  </div>
 </header>
 <section class="Explanation">
-  <h2 class="mt64 tac">Ti Nuage ?</h2>
-  <p class="mb64">L'association Ti Nuage offre une alternative locale aux <abbr title="Google, Apple, Facebook, Amazon, Microsoft, etc.">GAFAM</abbr> pour les associations, les petites entreprises et les particuliers de la région du Trégor. L’infrastructure technique est gérée par les membres de l’association et hébergée localement dans le Trégor.</p>
+  <h2 class="tac">Ti Nuage ?</h2>
+  <p class="mb64">L'association Ti Nuage offre une alternative locale aux <abbr title="Google, Apple, Facebook, Amazon, Microsoft, etc.">GAFAM</abbr> pour les associations, les petites entreprises et les particuliers de la région du Trégor. L’infrastructure technique est gérée par les membres de l’association. Son objet est de promouvoir la décentralisation et l'entraide et à terme d'héberger ses données dans le Trégor.</p>
   <div class="Two-cols-One-row">
     <div class="col-1">
       <h3 class="tac">Liberté</h3>
-      <p>Nous fournissons des outils en ligne à code source ouvert qui vous permettent de garder le contrôle de vos données et de votre vie privée. Quand cela est possible, elles sont chiffées sur le serveur (Mail, Nextcloud). Nous ne transmettons ni ne vendons d'informations sur l'utilisations de nos service à qui que ce soit.</p>
+      <p>Nous fournissons des outils en ligne à code source ouvert qui vous permettent de garder le contrôle de vos données et de votre vie privée. Quand cela est possible, ces données sont chiffées sur le serveur (courrier, documents personnels et partagés). Nous ne transmettons ni ne vendons d'informations sur l'utilisations de nos service à qui que ce soit.</p>
     </div>
     <div class="col-2">
       <h3 class="tac">Solidarité</h3>
-      <p>Nous nous organisons sur la base de l'autonomie, l'aide mutuelle, le partage de ressources et la création communautaire. Que vous soyez du métier ou simplement curieuse-eux, nous vous accueillons à bras ouverts.</p>
+      <p>Nous nous organisons sur la base de l'autonomie, l'aide mutuelle, le partage de ressources et la création communautaire. Chaque adhérent(e) possède une voix lorsqu'il s'agit de peser sur les activités de l'association. Que vous soyez du métier, intéressé(e) par les services proposés ou simplement curieux(se), nous vous accueillons à bras ouverts.</p>
     </div>
   </div>
+  <div class="tac mt32">
+    <a class="Button" href="/association.html">Découvrir l'association</a>
+  </div>
 </section>
 
 <section class="Services">
-  <h2 class="tac mt64 mb64">Nos services</h2>
+  <h2 class="tac mt64">Nos services</h2>
   <div class="Two-cols-Two-rows">
     <div>
-      <h3 class="services-title services-icon-web">Hébergement web</h3>
-      <p>Nous ne le créons pas pour vous, mais nous pouvons vous apporter des conseils et nous hébergeont votre site internet. Vous pouvez utiliser votre propre noms de domaine où utiliser gratuitement un sous-domaine ti-nuage.fr</p>
+      <h3 class="services-title services-icon-web">Hébergez votre vitrine</h3>
+      <p>Nous ne le créons pas pour vous, mais nous pouvons vous apporter des conseils et nous hébergeons votre site internet. Vous pouvez utiliser votre propre noms de domaine où utiliser gratuitement un sous-domaine ti-nuage.fr</p>
     </div>
     <div>
-      <h3 class="services-title services-icon-cloud">Partage de documents</h3>
-      <p>Partagez et collaborez sur des documents, envoyez et recevez des courriels, gérez votre calendrier et discutez par vidéo sans fuite de données. Synchronisez les contacts de votre téléphone.</p>
+      <h3 class="services-title services-icon-cloud">Collaborez</h3>
+      <p>Partagez des documents ou votre agenda ; gérez votre calendrier, vos tâches ou vos contacts avec une interface Web ou depuis votre mobile ; éditez des documents en ligne en collaboration avec d'autres personnes.</p>
     </div>
     <div>
-      <h3 class="services-title services-icon-email">Adresse e-mail</h3>
-      <p>Une adresse email @ti-nuage.fr consultable par webmail, Nextcloud ou avec votre client de messagerie habituel.</p>
+      <h3 class="services-title services-icon-email">Communiquez</h3>
+      <p>Obtenez une adresse de courriel <em>@ti-nuage.fr</em> consultable avec une interface Web ou votre client de messagerie habituel. Profitez de la possibilité de créer des listes de diffusion pour vos proches ou votre association. <em>Chattez</em> avec vos relations grâce à un outil de messagerie instantanée.</p>
     </div>
     <div>
-      <h3 class="services-title services-icon-ml">Liste de diffusion</h3>
-      <p>Une liste de diffusion nom@listes.ti-nuage.fr pour échanger avec les membres de votre organisation.</p>
+      <h3 class="services-title services-icon-key">Protégez votre vie privée</h3>
+      <p>Que ce soit pour stocker vos mots de passe, créer de sondages, héberger votre code logiciel, discuter en ligne, vos données et vos informations personnelles restent sur les serveurs de l'association.</p>
     </div>
   </div>
   <div class="tac mt32">

content/mentions_legales.md

@@ -4,14 +4,18 @@ title: Mentions légales
 ---
 ## Publication
 
-Ti Nuage, association loi 1901.
-Déclarée à la préfecture de police à Saint Brieuc le 18 octobre 2021 sous le numéro en cours.
-Siège social situé à la Mairie, 11 places aux Chevaux, 22420 Le Vieux Marché, France.
+**Ti Nuage** est une association loi 1901 déclarée à la préfecture de Saint Brieuc le 18 octobre 2021 sous le numéro en cours. Siège social :
+
+    Mairie,
+    11 places aux Chevaux,
+    22420 Le Vieux Marché - France
 
 ## Hébergement
 
-Sas OVH.
-Siège social : 2 rue Kellermann - 59100 Roubaix - France
+Ce site et toutes les données de l'association sont actuellement stockées chez la Sas OVH. Siège social :
+
+    2 rue Kellermann
+    59100 Roubaix - France
 
 ## Propriété intellectuelle
 

content/services.md

@@ -8,7 +8,7 @@ l'équipe technique de l'association.
 Nous sommes une petite structure et nous nous efforçons de donner le meilleur de nous même avec les moyens que nous avons à notre disposition. Malgré des sauvegardes quotidiennes et un suivi régulier de l'infrastructure, nous ne sommes pas à l'abris d'un incident. Nous ne garantissons donc pas une continuité de service permanente et nous ne nous assignons aucune obligation de résultat.
 
 <section class="Services">
-  <h2 class="tac mt192 mb64">Services réservés aux adhérents</h2>
+  <h2 class="tac mt128 mb64">Services réservés aux adhérents</h2>
   <div class="Two-cols-Two-rows">
     <div>
       <h3 class="services-title services-icon-web">Hébergement web</h3>
@@ -38,7 +38,7 @@ Nous sommes une petite structure et nous nous efforçons de donner le meilleur d
 </section>
 
 <section class="Services">
-  <h2 class="tac mt192 mb64">Services en libre accès, sans adhésion</h2>
+  <h2 class="tac mt128 mb64">Services en libre accès, sans adhésion</h2>
   <div class="Two-cols-Two-rows">
     <div>
       <h3 class="services-title services-icon-messages">Discussion instantanée</h3>

layouts/base.njk

@@ -16,7 +16,7 @@
   <body>
     <div class="Container">
       <menu>
-        <li class="LogoContainer">
+        <li class="container-logo">
           {% if not hidemenuicon %}
           <a href="/"><img class="logo-small" src="/images/logo.svg" alt=""></a>
           {% endif %}
@@ -38,15 +38,17 @@
     {% block article %}{% endblock %}
     </div>
 
-    <footer class="footer mt192">
+    <footer class="footer mt128">
       <div class="Container">
+        <hr>
         <div class="Two-cols-One-row">
           <div>
             <h4>Ti Nuage</h4>
             <ul>
               <li><a href="/">Accueil</a></li>
-              <li><a href="/blog">Blog</a></li>
-              <li><a href="/services.html">Services</a></li>
+              <li><a href="/association.html">L'association</a></li>
+              <li><a href="/blog">Le blog</a></li>
+              <li><a href="/services.html">Les services</a></li>
               <li><a href="/cgu.html">CGU</a></li>
               <li><a href="/mentions_legales.html">Mentions légales</a></li>
             </ul>

layouts/blog.njk

@@ -3,16 +3,11 @@
 {% block article %}
   {% block header %}{{ header | safe }}{% endblock %}
   <article>
-    {% block content %}{{ contents | safe }}{% endblock %}
-    {% set news = collections["archives"] %}
-       <ul>
-         {% for article in news %}
-         <li>
-            <p><a href="/{{ article.path }}">{{ moment(article.date).format('LL') }} | {{ article.title }}</a></p>
-            {{ article.excerpt | safe }}
-         </li>
-         {% else %}
-         {% endfor %}
-      </ul>
+    {% for article in collections["archives"] %}
+    <h2><a href="/{{ article.path }}">{{ moment(article.date).format('LL') }} | {{ article.title }}</a></h2>
+    {{ article.excerpt | safe }}
+    <p><a href="/{{ article.path }}">Lire la suite...</a></p>
+    {% else %}
+    {% endfor %}
   </article>
 {% endblock %}

layouts/front.njk

@@ -7,16 +7,12 @@
 
     <section class="Services">
       <h2 class="tac mt64">Actualités</h2>
-       {% set news = collections["news"] %}
-       <ul>
-         {% for article in news %}
-         <li>
-            <p><a href="{{ article.path }}">{{ moment(article.date).format('LL') }} | {{article.title }}</a></p>
-            {{ article.excerpt | safe }}
-         </li>
-         {% else %}
-         {% endfor %}
-      </ul>
+       {% for article in collections["news"] %}
+         <h3><a href="{{ article.path }}">{{ moment(article.date).format('LL') }} | {{article.title }}</a></h3>
+         {{ article.excerpt | safe }}
+         <p><a href="{{ article.path }}">Lire la suite...</a></p>
+       {% else %}
+       {% endfor %}
       <div class="tac mt32">
         <a class="Button" href="/blog">Voir les archives</a>
       </div>

scripts/metalsmith.js

@@ -56,12 +56,12 @@ module.exports = new Metalsmith(config.paths.projectRoot)
   }))
   .use(collections({
     archives: {
-      limit: 3,
       pattern: 'blog/*/**/*/*.html',
       reverse: true,
       sortBy: 'date'
     },
     news: {
+      limit: 3,
       pattern: 'blog/*/**/*.html',
       reverse: true,
       sortBy: 'date'