Merge pull request 'Met à jour les contenus en bas de page + page des services' (#43) from maj-footer into main

## Description

- Change la présentation du service site statique
- Corrige des typo
- Corrige la mise en page des premiers blocs de la page d'accueil
- Enlève les mentions de proposition commerciale
- Ajoute liens vers documents associatifs

- Organise la page des services par thématique
- Ajoute Garage à la liste
- changement de description pour Hedgedoc et Outline

Reviewed-on: #43
Reviewed-by: Simon <simon@resilien.fr>

assets/styles/main.sass

@@ -144,8 +144,8 @@ h1
   text-align: center
 
 h2
-  margin: 0 auto calc(var(--tile)*1.5)
-  padding: calc(var(--tile)*2) 0 0
+  margin: 0 auto calc(var(--tile)*0.5)
+  padding: calc(var(--tile)*1) 0 0
 
 h3
   margin: 0 auto var(--tile)
@@ -176,6 +176,9 @@ ol, ul
 li
   padding: .3rem 0
 
+  p
+    margin: 0
+
 
 ul.no-style
   margin: 0
@@ -422,3 +425,25 @@ sub
 .cell.\-right   { text-align: right; }
 
 @import "../../themes/hugo-theme-lowtech/assets/styles/obfuscates"
+
+.presentation
+  gap: 1rem
+  justify-content: center
+  > div
+    min-width: 300px
+    max-width: 450px
+  h2
+    text-align: center
+    margin-bottom: 1rem
+
+
+.section-features .row
+  display: flex
+  flex-wrap: wrap
+  justify-content: center
+  font-size: .9rem
+  gap: 1rem
+
+  > div
+    max-width: 300px
+    paddin: 1rem

content/_index.md

@@ -6,18 +6,44 @@ description: RésiLien est un hébergeur de services numériques localisé en Fr
 <div class="theme-primary">
 <div class="content">
 
-  > ## **Accompagner** <br>les organisations <br>qui ont une **conscience sociétale** <br>vers la réappropriation de<br>leurs **outils numériques**.
+  > ## **Vos** services <br> numériques libres
 {.quote}
 
-**RésiLien** est un hébergeur de services numériques localisé en France 🇫🇷 dont l'infrastructure est décentralisée. Nous respectons [la charte](https://www.chatons.org/charte) du [Collectif des Hébergeurs Alternatifs, Transparents, Ouverts, Neutres et Solidaires](https://chatons.org/) et sommes membres du collectif depuis [décembre 2021](https://www.chatons.org/chatons/resilien).
+<div class="presentation grid">
+  <div class="cell">
 
-Reprenez le contrôle sur vos données en utilisant exclusivement des **logiciels libres** et en les stockant sur du matériel de confiance.
+## Qui ?
 
-Engagez-vous dans la transition écologique 🍃 en optant pour une **sobriété numérique**.
+RésiLien est un hébergeur français de services numériques porté par une association, qui fait partie du collectif des [<abbr title="Collectif des Hébergeurs Alternatifs, Transparents, Ouverts, Neutres et Solidaires">CHATONS</abbr>](https://chatons.org/).
 
-Si vous avez une connexion Internet suffisante, hébergez dans votre local votre serveur contenant vos propres données. L'équipe de RésiLien en fera la maintenance à distance.
+  </div>
+  <div class="cell">
 
-RésiLien est une association à but non lucratif.
+## Quoi  ?
+
+
+ Nous proposons l'hébergement de sites web statiques ainsi que des services numériques
+ permettant de collaborer en ligne à l'aide de logiciels libres.
+
+  </div>
+  <div class="cell">
+
+## Pour qui ?
+
+Les associations, collectivités, entreprises et particuliers qui souhaitent reprendre le contrôle sur leur usage du numérique.
+
+  </div>
+  <div class="cell">
+
+## Pourquoi  ?
+
+- Pour participer à une vision plus conviviale du numérique que celle proposée par les grandes entreprises
+- Pour utiliser des services conçus dans votre intérêt sans que l'on profite de vous
+- Pour prendre conscience de l'impact environnemental de votre usage du numérique
+- Pour vous réapproprier le numérique en installant aussi vos propres serveurs chez vous
+
+  </div>
+</div>
 
 </div>
 </div>
@@ -29,7 +55,9 @@ RésiLien est une association à but non lucratif.
 ## Quels services propose RésiLien ?
 {.center}
 
-Tous les services sont Open Source et sont accompagnés d'une formation personnalisée. Des sauvegardes sont effectuées quotidiennement sur un autre site.
+Tous les services sont Open Source et hébergés sur une infrastructure décentralisée.
+<br>
+<a class="cta" href="/services/">Voir tous nos services</a>
 
 </div>
 <div class="sticky-cards">
@@ -49,21 +77,13 @@ Tous les services sont Open Source et sont accompagnés d'une formation personna
   </header>
   Avec le logiciel libre Nextcloud, partagez votre calendrier et vos contacts avec les membres de votre organisation.
 
-- <header>
-
-    ![Collaboration sur un document](/icons/writting.svg)
-    ### Prise de notes collaborative
-
-  </header>
-  Avec le logiciel libre Hedgedoc, prenez des notes à plusieurs au format Markdown.
-
 - <header>
 
     ![Éco-conception de site internet](/icons/website.svg)
     ### Site web statique
 
   </header>
-  Avec le logiciel libre Hugo, l'équipe de RésiLien peut concevoir un site web selon votre demande et l'héberger sur son infrastructure.
+  Avec le logiciel libre Garage, hébergez un site web statique facile à maintenir.
 { .cards }
 
 </div>
@@ -73,10 +93,27 @@ Tous les services sont Open Source et sont accompagnés d'une formation personna
 <div class="theme-primary">
 <div class="content">
 
+## Combien ça coûte ?
+
+L'adhésion est de 15€/an pour une personne physique et de 30€/ an pour une personne morale.
+
+Avec cette adhésion, un service de votre choix est inclus.
+
+Pour chaque service supplémentaire le coût est de 24€/an.
+
+Pour les services avec du stockage (100Mo inclus), le prix est de 1€/an par Go supplémentaire.
+
+<a href="/docs/Association RésiLien - Grille tarifaire.pdf">Voir la grille tarifaire</a>
+
+</div>
+</div>
+<div class="theme-secondary">
+<div class="content">
+
 ## Comment bénéficier des services de RésiLien ?
 {.center}
 
-Ayant à cœur d'avoir une **relation de proximité**, nous vous conseillons de contacter l'antenne la plus proche. Celle-ci vous enverra une proposition commerciale en fonction de vos besoins. Chaque prestation inclut une **période d'accompagnement pour l'utilisation des services**.
+Ayant à cœur d'avoir une **relation de proximité**, nous vous conseillons de contacter l'antenne la plus proche pour échanger à propos de vos besoins et de ce que RésiLien peut vous proposer.
 
 - #### Antenne Loire
   Simon Constans  

content/services.md

@@ -0,0 +1,22 @@
+---
+title: Services de RésiLien
+description: 
+---
+ 
+# Services de RésiLien
+
+## Communication en public
+
+{{< services "communication" >}}
+
+## Collaboration dans une équipe
+
+{{< services "collaboration" >}}
+
+## Bureautique
+
+{{< services "bureautique" >}}
+
+## Outils techniques
+
+{{< services "technique" >}}

data/services.yml

@@ -0,0 +1,132 @@
+services:
+  communication:
+    garage:
+      tool:
+        name: Garage
+        link: https://garagehq.deuxfleurs.fr/
+      title: Hébergement de site statique
+      icon: website
+      description: Hébergez votre site web statique facile à maintenir.
+      subdomain: www
+      doc: /docs/garage/hébergez/
+    mobilizon:
+      tool:
+        name: Mobilizon
+        link: https://joinmobilizon.org/
+      title: Rassembler
+      icon: speakerphone
+      description: Un outil qui vous permet de trouver, créer et organiser des événements. Publiez une page pour votre groupe !
+      subdomain: mobilizon
+      doc: /docs/mobilizon/rassembler/
+    listmonk:
+      tool:
+        name: listmonk
+        link: https://listmonk.app/
+      title: Infolettre
+      icon: mail-fast
+      description: Gestionnaire de **listes de diffusion** et d'infolettre avec envoi possible par mail ou SMS.
+      subdomain: infolettre
+      doc: /docs/listmonk/infolettre/
+  collaboration:
+    nextcloud:
+      tool:
+        name: Nextcloud
+        link: https://nextcloud.com/
+      title: Gérer vos données
+      icon: files
+      description: Gérez en collaboration vos **fichiers, contacts et agendas** pour permettre une bonne organisation.
+      subdomain: nuage
+      doc: /docs/nextcloud/gérer-vos-données/
+    element:
+      tool:
+        name: Element
+        link: https://element.io/
+      title: Discussion entre équipes
+      icon: messages
+      description: Échangez ensemble avec une **messagerie instantanée** sécurisée et décentralisée.
+      subdomain: chat
+      doc: /docs/element/discussion-entre-équipes/
+    hedgedoc:
+      tool:
+        name: Hedgedoc
+        link: https://hedgedoc.org/
+      title: Prise de notes
+      icon: pencil
+      description: Prenez des notes simultanément, à plusieurs, en ligne, et sans avoir à créer de compte, puis partager ses notes.
+      subdomain: notes
+      doc: /docs/hedgedoc/prise-de-notes/
+    outline:
+      tool:
+        name: Outline
+        link: https://www.getoutline.com/
+      title: Base de connaissance
+      icon: pencil
+      description: Collaborez sur **une documentation** en ligne pour mettre en lumière les connaissances de votre équipe.
+      subdomain: docs
+      doc: /docs/outline/prise-de-notes/
+    vikunja:
+      tool:
+        name: Vikunja
+        link: https://vikunja.io/
+      title: Gestion de projets
+      icon: list-details
+      description: Organisez vous autour de **listes de tâches** et rendre visible l'avancement de vos projets avec votre équipe.
+      subdomain: projets
+      path: '?redirectToProvider=true'
+      doc: /docs/vikunja/gestion-de-projets/
+  bureautique:
+    vaultwarden:
+      tool:
+        name: Vaultwarden
+        link: https://github.com/dani-garcia/vaultwarden/
+      title: Mots de passe
+      icon: shield-lock
+      description: Facilitez-vous la gestion et le partage de vos mots de passe, vous avez besoin de n'en retenir plus qu'un !
+      subdomain: pass
+      doc: /docs/vaultwarden/gestionnaire-de-mots-de-passe/
+    signaturepdf:
+      tool:
+        name: PDF Signature
+        link: https://github.com/24eme/signaturepdf/
+      title:  Gestion de PDF
+      icon: file-type-pdf
+      description: Signez, paraphez, modifiez, réorganisez, compressez vos fichiers PDF directement en ligne.
+      subdomain: pdf
+      doc: /docs/signaturepdf/gestion-de-pdf/
+    grist:
+      tool:
+        name: Grist
+        link: https://www.getgrist.com/
+      title: Tableur en ligne
+      icon: table-heart
+      description: Un puissant tableur en ligne permettant de **saisir et manipuler** collaborativement des données numériques.
+      subdomain: grist
+      doc: /docs/grist/tableur/
+  technique:
+    directus:
+      tool:
+        name: Directus
+        link: https://directus.io/
+      title: Gestion de contenu
+      icon: route-2
+      description: Directus est un logiciel de gestion de contenu qui permet de stocker et d'accéder au contenu via une API.
+      subdomain: admin
+      doc: /docs/directus/gestion-de-contenu/
+    gitea:
+      tool:
+        name: Gitea
+        link: https://about.gitea.com/
+      title: Forge logicielle
+      icon: brand-git
+      description: Gitea est une forge logicielle libre pour collaborer autour de développement logiciel et la **gestion du code source**.
+      subdomain: forge
+      doc: /docs/gitea/forge-logicielle/
+    metabase:
+      tool:
+        name: Metabase
+        link: https://www.metabase.com/
+      title: Analyse de données
+      icon: chart-dots-2
+      description: Solution d'informatique décisionnelle, mise en place de graphique de ses données pour piloter son activité.
+      subdomain: tableaudebord
+      doc: /docs/metabase/analyse-de-données/

layouts/partials/footer.html

@@ -11,6 +11,8 @@
     <li><a href="https://notes.resilien.fr/s/R%C3%A9silien.md">Documentation générale</a></li>
     <li><a href="/infrastructure/">Infrastructure</a> <a href="/sous-traitance/">Sous&#8209;traitance</a></li>
     <li> </li>
+    <li><a href="/docs/Association%20R%C3%A9siLien%20-%20Statuts.pdf">Statuts</a> <a href="/docs/Association%20R%C3%A9siLien%20-%20R%C3%A8glement%20int%C3%A9rieur.pdf">Règlement intérieur</a> <a href="/docs/Association%20R%C3%A9siLien%20-%20Grille%20tarifaire.pdf">Grille tarifaire</a></li>
+    <li> </li>
     <li><a href="/mentions-legales/">Mentions légales</a> <a href="/cgv/">CGV</a> <a href="/cgu/">CGU</a></li>
     <li><a href="/politique/">Politique de protection des données</a></li>
     </ul>

layouts/shortcodes/services.html

@@ -0,0 +1,16 @@
+<section class="section section-sm section-features">
+  <div class="container">
+    <div class="row justify-content-center text-center">
+      {{- $category := .Get 0 }}
+      {{ range $service := index site.Data.services.services $category }}
+      <div class="col-12 col-lg-5 col-sm-6">
+        <h2 class="h4">
+          {{- $service.title -}}
+        </h2>
+        <p>{{ $service.description | markdownify }}</p>
+        <p class="text-muted"><small>Propulsé par <a href="{{ $service.tool.link }}">{{ $service.tool.name }}</a></small></p>
+      </div>
+      {{ end }}
+    </div>
+  </div>
+</section>