feat: Add docs

README.md

@@ -4,7 +4,10 @@ Documentation du Services Numériques Libres hébergé dans le département de l
 
 ## TODO
 
-- [ ] Modifier les couleurs du theme
+- [ ] Rédiger la page « Mentions légales »
+- [ ] Rédifger la page « Politique de Protection des Données »
+- [ ] Ajouter une page 404
+- [x] Modifier les couleurs du theme
 - [ ] Refaire faire le logo
 - [x] Ajouter du contenu pour le logiciel PDF
 - [x] Ajouter le déploiement automatique

assets/scss/app.scss

@@ -4,9 +4,13 @@
 /** Import theme variables */
 $primary: #42b883;
 $link-color-dark: $primary;
+
 @import "common/variables";
 
 /** Import Bootstrap */
+$primary: #42b883;
+$link-color-dark: $primary;
+
 @import "bootstrap/scss/bootstrap";
 
 /** Import highlight.js */

assets/scss/common/_dark.scss

@@ -0,0 +1,582 @@
+/** Theme variables */
+
+// Source: https://material.io/design/color/dark-theme.html
+
+$body-bg-dark: $gray-900;
+$body-overlay-dark: darken($body-bg-dark, 2.5%);
+
+/*
+$border-dark: darken($body-bg-dark, 2.5%);
+*/
+$border-dark: $gray-800;
+$body-color-dark: $gray-300;
+$dots-dark: darken($body-color-dark, 50%);
+
+$link-color-dark: #42b883;
+$button-color-dark: $link-color-dark;
+$focus-color-dark: lighten($link-color-dark, 2.5%);
+
+$navbar-dark-color:                 $body-color-dark;
+$navbar-dark-hover-color:           $link-color-dark;
+$navbar-dark-active-color:          $link-color-dark;
+
+/** Theme styles */
+
+[data-dark-mode] body {
+  background: $body-bg-dark;
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body a {
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body a.text-body {
+  color: $body-color-dark !important;
+}
+
+[data-dark-mode] body .btn-primary {
+  @include button-variant($button-color-dark, $button-color-dark);
+
+  color: $body-bg-dark !important;
+}
+
+[data-dark-mode] body .btn-outline-primary {
+  @include button-outline-variant($button-color-dark, $button-color-dark);
+
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body .btn-outline-primary:hover {
+  color: $body-bg-dark;
+}
+
+[data-dark-mode] body .btn-doks-light {
+  color: $navbar-dark-color;
+}
+
+[data-dark-mode] body .show > .btn-doks-light,
+[data-dark-mode] body .btn-doks-light:hover,
+[data-dark-mode] body .btn-doks-light:active {
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body .btn-menu svg {
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body .doks-sidebar-toggle {
+  color: $navbar-dark-color;
+}
+
+[data-dark-mode] body .btn-menu:hover,
+[data-dark-mode] body .btn-doks-light:hover,
+[data-dark-mode] body .doks-sidebar-toggle:hover {
+  background: $body-overlay-dark;
+}
+
+/*
+[data-dark-mode] body .dropdown-menu {
+  @extend .dropdown-menu-dark;
+}
+*/
+
+[data-dark-mode] body .navbar,
+[data-dark-mode] body .doks-subnavbar {
+  background-color: rgba(33, 37, 41, 0.95);
+  border-bottom: 1px solid $border-dark;
+}
+
+[data-dark-mode] body.home .navbar {
+  border-bottom: 0;
+}
+
+[data-dark-mode] body .offcanvas-header {
+  border-bottom: 1px solid $gray-800;
+}
+
+[data-dark-mode] body .offcanvas .nav-link {
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body .offcanvas .nav-link:hover,
+[data-dark-mode] body .offcanvas .nav-link:focus {
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body .offcanvas .nav-link.active {
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body .navbar-light .navbar-brand {
+  color: $navbar-dark-color !important;
+}
+
+[data-dark-mode] body .navbar-light .navbar-nav .nav-link {
+  color: $navbar-dark-color;
+}
+
+[data-dark-mode] body .navbar-light .navbar-nav .nav-link:hover,
+[data-dark-mode] body .navbar-light .navbar-nav .nav-link:focus {
+  color: $navbar-dark-hover-color;
+}
+
+[data-dark-mode] body .navbar-light .navbar-nav .nav-link.disabled {
+  color: $navbar-dark-disabled-color;
+}
+
+[data-dark-mode] body .navbar-light .navbar-nav .show > .nav-link,
+[data-dark-mode] body .navbar-light .navbar-nav .active > .nav-link,
+[data-dark-mode] body .navbar-light .navbar-nav .nav-link.show,
+[data-dark-mode] body .navbar-light .navbar-nav .nav-link.active {
+  color: $navbar-dark-active-color;
+}
+
+[data-dark-mode] body .navbar-light .navbar-text {
+  color: $navbar-dark-color;
+}
+
+[data-dark-mode] body .alert-primary a {
+  color: $body-bg-dark;
+}
+
+[data-dark-mode] body .alert-doks {
+  background: $body-overlay-dark;
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body .alert-doks a {
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body .page-links a {
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body .btn-toggle-nav a {
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body .showcase-meta a {
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body .showcase-meta a:hover,
+[data-dark-mode] body .showcase-meta a:focus {
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body .docs-link:hover,
+[data-dark-mode] body .docs-link.active,
+[data-dark-mode] body .page-links a:hover {
+  text-decoration: none;
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body .btn-toggle {
+  color: $body-color-dark;
+  background-color: transparent;
+  border: 0;
+}
+
+[data-dark-mode] body .btn-toggle:hover,
+[data-dark-mode] body .btn-toggle:focus {
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body .btn-toggle::before {
+  width: 1.25em;
+  line-height: 0;
+  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%28222, 226, 230, 0.75%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
+  transition: transform 0.35s ease;
+  transform-origin: 0.5em 50%;
+  margin-bottom: 0.125rem;
+}
+
+[data-dark-mode] body .btn-toggle[aria-expanded="true"] {
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body .btn-toggle[aria-expanded="true"]::before {
+  transform: rotate(90deg);
+}
+
+[data-dark-mode] body .btn-toggle-nav a:hover,
+[data-dark-mode] body .btn-toggle-nav a:focus {
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body .btn-toggle-nav a.active {
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body .navbar-light .navbar-text a {
+  color: $navbar-dark-active-color;
+}
+
+[data-dark-mode] body .docs-links h3.sidebar-link a,
+[data-dark-mode] body .page-links h3.sidebar-link a {
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body .navbar-light .navbar-text a:hover,
+[data-dark-mode] body .navbar-light .navbar-text a:focus {
+  color: $navbar-dark-active-color;
+}
+
+[data-dark-mode] body .navbar .btn-link {
+  color: $navbar-dark-color;
+}
+
+[data-dark-mode] body .content .btn-link {
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body .content .btn-link:hover {
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body .content img[src^="https://latex.codecogs.com/svg.latex"] {
+  filter: invert(1);
+}
+
+[data-dark-mode] body .navbar .btn-link:hover {
+  color: $navbar-dark-hover-color;
+}
+
+[data-dark-mode] body .navbar .btn-link:active {
+  color: $navbar-dark-active-color;
+}
+
+[data-dark-mode] body .form-control.is-search {
+  background: $body-overlay-dark;
+  border: 1px solid transparent;
+  color: $gray-300;
+
+  /*
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%236c757d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-search'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right calc(0.375em + 0.1875rem) center;
+  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
+  */
+}
+
+[data-dark-mode] body .form-control.is-search:focus {
+  border: 1px solid $link-color-dark;
+}
+
+[data-dark-mode] body .doks-search::after {
+  color: $gray-300;
+  border: 1px solid $gray-700;
+}
+
+[data-dark-mode] body .text-dark {
+  color: $body-color-dark !important;
+}
+
+/*
+[data-dark-mode] body .navbar-form::after {
+  color: $gray-600;
+  border: 1px solid $gray-800;
+}
+*/
+
+[data-dark-mode] body .form-control {
+  color: $gray-300;
+}
+
+[data-dark-mode] body .form-control::placeholder {
+  color: $gray-400;
+  opacity: 1;
+}
+
+[data-dark-mode] body .border-top {
+  border-top: 1px solid $border-dark !important;
+}
+
+@include media-breakpoint-up(lg) {
+  [data-dark-mode] body .docs-sidebar {
+    order: 0;
+    border-right: 1px solid $border-dark;
+  }
+}
+
+[data-dark-mode] body .docs-navigation {
+  border-top: 1px solid $border-dark;
+}
+
+[data-dark-mode] body pre code::-webkit-scrollbar-thumb {
+  background: $gray-400;
+}
+
+[data-dark-mode] body code:not(.hljs) {
+  background: $body-overlay-dark;
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body pre code:hover {
+  scrollbar-width: thin;
+  scrollbar-color: $border-dark transparent;
+}
+
+[data-dark-mode] body pre code::-webkit-scrollbar-thumb:hover {
+  background: $gray-500;
+}
+
+[data-dark-mode] body blockquote {
+  border-left: 3px solid $border-dark;
+}
+
+[data-dark-mode] body .footer {
+  border-top: 1px solid $border-dark;
+}
+
+[data-dark-mode] body .docs-links,
+[data-dark-mode] body .docs-toc {
+  scrollbar-width: thin;
+  scrollbar-color: $body-bg-dark $body-bg-dark;
+}
+
+[data-dark-mode] body .docs-links::-webkit-scrollbar,
+[data-dark-mode] body .docs-toc::-webkit-scrollbar {
+  width: 5px;
+}
+
+[data-dark-mode] body .docs-links::-webkit-scrollbar-track,
+[data-dark-mode] body .docs-toc::-webkit-scrollbar-track {
+  background: $body-bg-dark;
+}
+
+[data-dark-mode] body .docs-links::-webkit-scrollbar-thumb,
+[data-dark-mode] body .docs-toc::-webkit-scrollbar-thumb {
+  background: $body-bg-dark;
+}
+
+[data-dark-mode] body .docs-links:hover,
+[data-dark-mode] body .docs-toc:hover {
+  scrollbar-width: thin;
+  scrollbar-color: $border-dark $body-bg-dark;
+}
+
+[data-dark-mode] body .docs-links:hover::-webkit-scrollbar-thumb,
+[data-dark-mode] body .docs-toc:hover::-webkit-scrollbar-thumb {
+  background: $border-dark;
+}
+
+[data-dark-mode] body .docs-links::-webkit-scrollbar-thumb:hover,
+[data-dark-mode] body .docs-toc::-webkit-scrollbar-thumb:hover {
+  background: $border-dark;
+}
+
+[data-dark-mode] body .docs-links h3:not(:first-child) {
+  border-top: 1px solid $border-dark;
+}
+
+[data-dark-mode] body a.docs-link {
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body .page-links li:not(:first-child) {
+  border-top: 1px dashed $border-dark;
+}
+
+[data-dark-mode] body .card {
+  background: $body-bg-dark;
+  border: 1px solid $border-dark;
+}
+
+[data-dark-mode] body .card.bg-light {
+  background: $body-overlay-dark !important;
+}
+
+[data-dark-mode] body .navbar .menu-icon .navicon {
+  background: $navbar-dark-color;
+}
+
+[data-dark-mode] body .navbar .menu-icon .navicon::before,
+[data-dark-mode] body .navbar .menu-icon .navicon::after {
+  background: $navbar-dark-color;
+}
+
+[data-dark-mode] body .logo-light {
+  display: none !important;
+}
+
+[data-dark-mode] body .logo-dark {
+  display: inline-block !important;
+}
+
+[data-dark-mode] body .bg-light {
+  background: darken($body-bg-dark, 1.5%) !important;
+}
+
+[data-dark-mode] body .bg-dots {
+  background-image: radial-gradient($dots-dark 15%, transparent 15%);
+}
+
+[data-dark-mode] body .text-muted {
+  color: darken($body-color-dark, 7.5%) !important;
+}
+
+[data-dark-mode] body .alert-primary {
+  background: $link-color-dark;
+  color: $body-bg-dark;
+}
+
+[data-dark-mode] body .figure-caption {
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body table {
+  @extend .table-dark;
+}
+
+[data-dark-mode] body .copy-status::after {
+  content: "Copy";
+  display: block;
+  color: $body-color-dark;
+}
+
+[data-dark-mode] body .copy-status:hover::after {
+  content: "Copy";
+  display: block;
+  color: $link-color-dark;
+}
+
+[data-dark-mode] body .copy-status:focus::after,
+[data-dark-mode] body .copy-status:active::after {
+  content: "Copied";
+  display: block;
+  color: $link-color-dark;
+}
+
+/*
+[data-dark-mode] body .dropdown-toggle:focus,
+[data-dark-mode] body .doks-sidebar-toggle:focus {
+  box-shadow: 0 0 0 0.2rem $focus-color-dark;
+}
+*/
+
+[data-dark-mode] body .offcanvas {
+  background-color: $body-bg-dark;
+}
+
+[data-dark-mode] body .btn-close {
+  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNkZWUyZTYiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0iZmVhdGhlciBmZWF0aGVyLXgiPjxsaW5lIHgxPSIxOCIgeTE9IjYiIHgyPSI2IiB5Mj0iMTgiPjwvbGluZT48bGluZSB4MT0iNiIgeTE9IjYiIHgyPSIxOCIgeTI9IjE4Ij48L2xpbmU+PC9zdmc+");
+  background-size: 1.5rem;
+}
+
+@include media-breakpoint-up(md) {
+  [data-dark-mode] body .alert-dismissible .btn-close {
+    background-size: 1.25rem;
+  }
+}
+
+/*
+[data-dark-mode] body .btn-close:focus {
+  box-shadow: 0 0 0 0.2rem $focus-color-dark;
+}
+*/
+
+[data-dark-mode] .dropdown-item {
+  color: $body-bg-dark;
+}
+
+[data-dark-mode] body hr.text-black-50 {
+  color: $gray-600 !important;
+}
+
+[data-dark-mode] body .email-form .form-control {
+  background: $body-overlay-dark;
+  border: 1px solid transparent;
+}
+
+[data-dark-mode] body .email-form .form-control:focus {
+  border: 1px solid $link-color-dark;
+}
+
+[data-dark-mode] .page-link {
+  color: $link-color-dark;
+  background-color: transparent;
+  border: $pagination-border-width solid $border-dark;
+
+  &:hover {
+    color: $body-bg-dark;
+    background-color: $body-color-dark;
+    border-color: $body-color-dark;
+  }
+
+  &:focus {
+    color: $body-bg-dark;
+    background-color: $body-color-dark;
+  }
+}
+
+[data-dark-mode] .page-item {
+  &.active .page-link {
+    color: $body-bg-dark;
+
+    @include gradient-bg($link-color-dark);
+
+    border-color: $link-color-dark;
+  }
+
+  &.disabled .page-link {
+    color: $pagination-disabled-color;
+    background-color: $body-overlay-dark;
+    border-color: $border-dark;
+  }
+}
+
+[data-dark-mode] .dropdown-menu {
+  background: $body-overlay-dark;
+}
+
+[data-dark-mode] .dropdown-menu .dropdown-item {
+  color: $body-color-dark;
+}
+
+[data-dark-mode] .dropdown-menu .dropdown-item:hover {
+  color: $link-color-dark;
+  background: $body-bg-dark;
+}
+
+[data-dark-mode] .dropdown-menu .dropdown-item.active,
+[data-dark-mode] .dropdown-menu .dropdown-item:focus {
+  color: $link-color-dark;
+  background: $body-bg-dark;
+}
+
+[data-dark-mode] .doks-navbar .dropdown-item.current,
+[data-dark-mode] .doks-subnavbar .dropdown-item.current {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23dee2e6' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
+  background-repeat: no-repeat;
+  background-position: right 1rem top 0.6rem;
+  background-size: 0.75rem 0.75rem;
+}
+
+[data-dark-mode] details {
+  border: 1px solid $border-dark;
+}
+
+[data-dark-mode] summary:hover {
+  background: $body-overlay-dark;
+}
+
+[data-dark-mode] details[open] > summary {
+  border-bottom: 1px solid $border-dark;
+}
+
+[data-dark-mode] details summary::before {
+  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%28222, 226, 230, 0.75%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
+}
+
+[data-dark-mode] #toc a.active {
+  color: $link-color-dark;
+}
+
+[data-dark-mode] .btn-light {
+  color: $link-color-dark;
+  background: $body-overlay-dark;
+  border: 1px solid $body-overlay-dark;
+}

config/_default/module.toml

@@ -3,6 +3,10 @@
   min = "0.80.0"
   max = ""
 
+[[mounts]]
+  source = "assets"
+  target = "assets"
+
 [[mounts]]
   source = "node_modules/@hyas/doks/archetypes"
   target = "archetypes"
@@ -11,10 +15,6 @@
   source = "node_modules/@hyas/doks/assets"
   target = "assets"
 
-[[mounts]]
-  source = "assets"
-  target = "assets"
-
 #  [[mounts]]
 #    source = "node_modules/@hyas/doks/content"
 #    target = "content"

config/_default/params.toml

@@ -65,7 +65,7 @@ defaultImage = "default-image.png" # put in `./assets/images/`
 fillImage = "1270x740 Center" # normalize image size
 
 # Footer
-footer = "Réalisé par <a href=\"https://weko.io/\">Weko</a> avec ❤️ et Hébergé par <a href=\"https://resilien.fr/\">RésiLien</a> 🐱"
+footer = "Réalisé par <a href=\"https://weko.io/\">Weko</a> avec ❤️ et Hébergé par <a href=\"https://resilien.fr/\">RésiLien</a> 🐱"
 
 # Feed
 copyRight = "Copyright (c) 2023 Weko"
@@ -111,4 +111,4 @@ lastMod = false
 [menu]
   [menu.section]
     auto = true
-    collapsibleSidebar = true
+    collapsibleSidebar = false

content/_index.md

@@ -1,7 +1,7 @@
 ---
 title : "Services Numériques Libres"
 description: "L'ensemble des services sont hébergés dans le département de la Loire (42)"
-lead: "Ce site WEB vous met à disposition de multiples services utiles pour collaborer, partager et avoir une vie numérique plus « saine »."
+lead: "Ce site WEB vous met à disposition de multiples services utiles pour collaborer, partager et avoir une vie numérique plus « saine »."
 date: 2020-10-06T08:47:36+00:00
 lastmod: 2020-10-06T08:47:36+00:00
 draft: false

content/docs/general/_index.md

@@ -0,0 +1,11 @@
+---
+title: "Général"
+description: ""
+lead: ""
+date: 2022-01-25T14:41:21+01:00
+lastmod: 2022-01-25T14:41:21+01:00
+draft: false
+images: []
+type: docs
+weight: 40
+---

content/docs/general/navigateur.md

@@ -0,0 +1,51 @@
+---
+title: "Navigateur WEB"
+description: ""
+lead: ""
+date: 2020-10-06T08:48:57+00:00
+lastmod: 2020-10-06T08:48:57+00:00
+draft: false
+images: []
+menu:
+  docs:
+    parent: "general"
+weight: 100
+toc: true
+type: docs
+---
+
+## Définition
+
+Un navigateur WEB est un logiciel permettant de consulter des pages WEB, ce n'est donc pas [un moteur de recherche](../recherche/) 😜.
+
+## 🖥️ Sur ordinateur
+
+{{< alert icon="👍" >}}
+Nous conseillons les navigateurs suivant :
+
+- [Firefox](https://www.mozilla.org/fr/firefox/new/) réalisé et distribué par la [fondation Mozilla](https://foundation.mozilla.org/fr/)
+- [Brave](https://brave.com/fr/) dont l'objectif est de protéger la vie privée de ses utilisateurs
+- [Chromium](https://www.chromium.org/getting-involved/download-chromium/) est un équivalent de Chrome sans les mouchards de Google
+{{< /alert >}}
+
+Les navigateurs contenant de nombreux espions à éviter :
+
+- Chrome fait par Google
+- Safari fait par Apple
+- Edge fait par Microsoft
+
+## 📱 Sur téléphone
+
+{{< alert icon="👍" >}}
+Nous conseillons les navigateurs suivant :
+
+- [Firefox](https://www.mozilla.org/fr/firefox/browsers/mobile/) réalisé et distribué par la [fondation Mozilla](https://foundation.mozilla.org/fr/)
+{{< /alert >}}
+
+## Culture
+
+Un navigateur a besoin d'un moteur de rendu pour afficher correctement une page WEB, il en existe plusieurs mais c'est pour cela que parfois des pages ne s'affichent pas de la même manière selon le navigateur.
+
+## Liens
+
+- [Définition d'un navigateur WEB par Wikipedia](https://fr.wikipedia.org/wiki/Navigateur_web)

content/docs/general/recherche.md

@@ -0,0 +1,36 @@
+---
+title: "Moteur de recherche"
+description: ""
+lead: ""
+date: 2020-10-06T08:48:57+00:00
+lastmod: 2020-10-06T08:48:57+00:00
+draft: false
+images: []
+menu:
+  docs:
+    parent: "general"
+weight: 80
+toc: true
+type: docs
+---
+
+## Définition
+
+Un moteur de recherche est un service en ligne permettant à des utilisateur d'effectuer une recherche à parti d'un texte et ainsi afficher des ressources correspondante.
+
+{{< alert icon="👍" >}}
+Nous conseillons les moteurs de recherche suivant :
+
+- [Lilo](https://search.lilo.org/) est une entreprise numérique française qui finance des projets sociaux et environnementaux, choisis par les internautes
+- [Ecosia](https://brave.com/fr/) moteur de recherche allemand qui reverse une part de ses bénéfices à des associations à but non lucratif qui œuvrent aux programmes de reforestation
+- [DuckDuckGo](https://duckduckgo.com/) est un moteur de recherche américain qui vise à préserver la vie privée de ses utilisateurs
+{{< /alert >}}
+
+Les moteurs de recherche que nous déconseillons :
+
+- Google
+- Bind
+
+## Liens
+
+- [Définition d'un moteur de recherche par Wikipedia](https://fr.wikipedia.org/wiki/Moteur_de_recherche)

content/docs/introduction/bienvenue.md

@@ -14,16 +14,20 @@ toc: true
 type: docs
 ---
 
-Vous êtes le bienvenue dans la communauté [`Loi.re`](https://loi.re) !
+Vous êtes bienvenue dans la communauté [`Loi.re`](https://loi.re) !
 
 Vous trouverez ici de la documentation autour des services que l'on propose ainsi que sur le numérique responsable !
 
 ## Questions ou suggestions
 
-C'est une communauté ouverte n'hésitez pas à interragir avec nous par mail à [discussions@loi.re](mailto:discussions@loi.re).
+C'est une communauté ouverte n'hésitez pas à interagir avec nous par mail à [discussions@loi.re](mailto:discussions@loi.re).
 
 Prochainement nous ouvrirons un forum pour faciliter les échanges.
 
+## Qui sommes-nous ? 🐱
+
+Derrière le service [`Loi.re`](https://loi.re) il y a l'équipe de [RésiLien](https://resilien.fr) un hébergeur alternatif présent dans la Loire, nous travaillons à promouvoir un numérique responsable ! Nous nous sommes engagé à respecter [la charte](https://www.chatons.org/charte) forte du [Collectif des Hébergeurs Alternatifs, Transparents, Ouverts, Neutres et Solidaires](https://www.chatons.org) dont nous faisons partie depuis décembre 2021.
+
 ## La Loire
 
 {{< alert icon="💡" >}}
@@ -39,9 +43,9 @@ par [THD42](https://www.thd42.fr/) une initiative du
 [SIEL - Territoire d'énergie](https://www.te42.fr/) un **acteur public**
 opérationnel de la transition énergétique et de l’aménagement numérique.
 
-Utilisons des services numérique directement hébergés localement plutôt
-qu'à l'autre bout du monde. Vous êtes dans un autre département ? Vous pouvez retrouver d'autres services numérique libre depuis le site des [CHATONS](https://www.chatons.org/search/near-me) (Le Collectif des Hébergeurs Alternatifs, Transparents, Ouverts, Neutres et Solidaires).
+Utilisons des services numériques directement hébergés localement plutôt
+qu'à l'autre bout du monde.
 
-## Qui sommes nous ?
+## Autres départements ?
 
-Derrière le service [`Loi.re`](https://loi.re) il y a l'équipe de [RésiLien](https://resilien.fr) un hébergeur alternatif présent dans la Loire, nous travaillons à promouvoir un numérique responsable !
+Vous êtes dans un autre département ? Vous pouvez retrouver d'autres services numérique libre depuis le site des [CHATONS](https://www.chatons.org/search/near-me).

content/docs/introduction/libres.md

@@ -0,0 +1,42 @@
+---
+title: "Découvrez les logiciels libres : libérez le potentiel de votre informatique !"
+description: ""
+lead: ""
+date: 2020-10-06T08:48:57+00:00
+lastmod: 2020-10-06T08:48:57+00:00
+draft: false
+images: []
+menu:
+  docs:
+    parent: "introduction"
+titleMenu: logiciels libres ?
+weight: 100
+toc: true
+type: docs
+---
+
+Dans notre monde de plus en plus connecté, l'informatique joue un rôle central dans notre quotidien. Mais saviez-vous qu'il existe une approche alternative pour utiliser les outils informatiques ? **Les logiciels libres** offrent une solution qui met le pouvoir entre vos mains. Dans cet article, nous allons explorer le monde des logiciels libres et découvrir comment ils peuvent améliorer votre expérience informatique, tout en favorisant la transparence, la sécurité et l'autonomie.
+
+## Qu'est-ce que les logiciels libres ?
+
+Les logiciels libres sont des programmes informatiques dont le code source est disponible pour tous. En d'autres termes, ils sont "ouverts" et permettent à chacun de les étudier, de les modifier et de les distribuer selon ses besoins. Contrairement aux logiciels propriétaires, qui sont souvent la propriété exclusive d'une entreprise, les logiciels libres offrent une liberté d'utilisation et une transparence totale.
+
+## Les avantages des logiciels libres
+
+- **Contrôle total :** Avec les logiciels libres, vous avez le plein contrôle sur votre informatique. Vous pouvez personnaliser les programmes en fonction de vos besoins spécifiques, ce qui signifie que vous n'êtes pas limité aux fonctionnalités préétablies. Vous êtes le maître de votre outil, et non pas l'inverse !
+- **Sécurité et confidentialité :** Les logiciels libres sont développés par des communautés engagées qui se soucient de la sécurité des utilisateurs. Étant donné que le code source est accessible, les erreurs et les vulnérabilités sont rapidement détectées et corrigées. Vous pouvez donc être sûr que votre logiciel est sécurisé et respecte votre vie privée.
+- **Transparence et confiance :** Avec les logiciels libres, vous n'avez pas à faire confiance aveuglément à un éditeur. Vous pouvez inspecter le code source pour comprendre comment le logiciel fonctionne réellement. Cela garantit qu'il n'y a pas de fonctionnalités cachées ou de collecte excessive de données. Vous pouvez donc utiliser votre logiciel en toute confiance.
+- **Coût et accessibilité :** Les logiciels libres sont souvent disponibles gratuitement, ce qui réduit considérablement les coûts liés à l'acquisition de licences. De plus, ils favorisent l'égalité d'accès à la technologie, car tout le monde peut les utiliser, indépendamment de ses moyens financiers.
+- **Collaboration et communauté :** Les logiciels libres sont soutenus par des communautés dynamiques où les utilisateurs et les développeurs collaborent. Cela signifie que vous pouvez trouver un soutien, des conseils et des ressources auprès de personnes partageant les mêmes intérêts. Les forums et les groupes de discussion vous permettent d'apprendre et d'échanger avec d'autres passionnés.
+
+## Conclusion
+
+Les logiciels libres offrent une alternative passionnante et responsable pour utiliser l'informatique. En vous donnant le contrôle total, en garantissant la sécurité et la confidentialité, et en favorisant la collaboration, ils libèrent votre potentiel informatique. Alors, pourquoi ne pas rejoindre le mouvement des logiciels libres et explorer ce monde fascinant ? Libérez votre informatique et ouvrez-vous à de nouvelles possibilités infinies !
+
+## Ressources
+
+Voici quelques ressources si vous voulez approfondir le sujet :
+
+- [« Logiciel libre » sur Wikipedia](https://fr.wikipedia.org/wiki/Logiciel_libre)
+- La [Free Software Foundation](https://www.fsf.org/) est une organisation internationale dédiée à la promotion du logiciel libre. Sur leur site web, vous trouverez une section [« Qu'est-ce que le logiciel libre ? »](https://www.fsf.org/fr/quest-ce-que-le-logiciel-libre) qui fournit des informations détaillées sur les principes et les avantages des logiciels libres.
+- L'[Open Source Initiative](https://opensource.org/) est une organisation qui promeut l'adoption de l'open source à travers le monde. Leur site web propose une section "À propos de l'open source" qui explique les principes fondamentaux de l'open source et fournit des informations sur les licences open source.

content/docs/pdf/introduction.md

@@ -8,7 +8,7 @@ draft: false
 images: []
 menu:
   docs:
-    parent: "services"
+    parent: "pdf"
 weight: 100
 toc: true
 type: docs
@@ -33,4 +33,4 @@ Le service ne sauvegarde jamais votre fichier, vous n'avez donc aucune crainte q
 
 ## Outil libre
 
-L'outil utilisé est [signaturepdf](https://github.com/24eme/signaturepdf), il est édité par la coopértive parisienne « [24eme](https://www.24eme.fr/) » sous la license [AGPLv3](https://www.gnu.org/licenses/agpl-3.0.html).
+L'outil utilisé est [signaturepdf](https://github.com/24eme/signaturepdf), il est édité par la coopérative parisienne « [24eme](https://www.24eme.fr/) » sous la licence [AGPLv3](https://www.gnu.org/licenses/agpl-3.0.html).

layouts/_default/baseof.html

@@ -28,5 +28,6 @@
       <a id="toTop" href="#" class="btn btn-outline-primary rounded-circle ms-auto p-2"><span class="visually-hidden">Top</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-up"><polyline points="18 15 12 9 6 15"></polyline></svg></a>
     </div>
     {{ end }}
+    <script defer data-domain="loi.re" src="https://analytiques.resilien.cloud/js/plausible.js"></script>
   </body>
-</html>
+</html>

layouts/partials/footer/footer.html

@@ -0,0 +1,18 @@
+<footer class="footer text-muted text-center text-lg-start">
+  <div class="container-{{ if .Site.Params.options.fullWidth }}fluid{{ else }}xxl{{ end }}">
+    <div class="row">
+      <div class="col-lg-8 order-last order-lg-first">
+        <ul class="list-inline">
+          <li class="list-inline-item">{{ .Site.Params.footer | safeHTML }}</li>
+        </ul>
+      </div>
+      <div class="col-lg-8 order-first order-lg-last text-lg-end">
+        <ul class="list-inline">
+          {{ range .Site.Menus.footer -}}
+            <li class="list-inline-item"><a href="{{ .URL | relURL }}">{{ .Name }}</a></li>
+          {{ end -}}
+        </ul>
+      </div>
+    </div>
+  </div>
+</footer>

layouts/partials/sidebar/auto-default-menu.html

@@ -0,0 +1,37 @@
+<!-- Auto default section menu -->
+{{ $currentPage := . -}}
+{{ $section := $currentPage.Section -}}
+{{ range (where .Site.Sections "Section" "in" $section) }}
+  {{ range .Sections }}
+    {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+    <h3 class="h6 text-uppercase mb-2">{{ .Title }}</h3>
+    <ul class="list-unstyled">
+      {{ range .Pages }}
+        {{ if .IsNode }}
+          {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+          <h4 class="h6 text-uppercase ms-3 mt-3 mb-2">{{ .Title }}</h4>
+          <ul class="list-unstyled ms-3">
+            {{ range .Pages }}
+              {{ if .IsNode }}
+                {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                <h5 class="h6 text-uppercase mt-2 mb-2">{{ .Title }}</h5>
+                <ul class="list-unstyled ms-3">
+                  {{ range .Pages }}
+                    {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                    <li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Name }}</a></li>
+                  {{ end }}
+                </ul>
+              {{ else }}
+                {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                <li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Name }}</a></li>
+              {{ end }}
+            {{ end }}
+          </ul>
+        {{ else }}
+          {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+          <li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ default .Name .Params.titleMenu }}</a></li>
+        {{ end }}
+      {{ end }}
+    </ul>
+  {{ end }}
+{{ end }}