feat: Update content

assets/styles/container.sass

@@ -1,3 +1,5 @@
+.center
+  text-align: center
 .container
   max-width: $size-small
   width: 100%
@@ -20,11 +22,15 @@
   &.center
     justify-content: center
     align-items: center
-    text-align: center
 
   &.column
     flex-direction: column
 
+  &.cards
+    padding: $size-space/2
+    @media screen and (max-width: $size-small)
+      padding: $size-space/2 0
+
 main > section:first-child
   padding: $size-space*2 $size-space $size-space*3
 
@@ -43,11 +49,12 @@ main > section:first-child
       text-shadow: 0 0 1px currentColor
 
   .card
+    margin: $size-space/2
     background-color: var(--card-background)
     z-index: 10
     padding: 1rem
     border-radius: var(--border-radius)
-    max-width: 31%
+    max-width: 29%
     margin-bottom: 1rem
 
     img

assets/styles/footer.sass

@@ -1,2 +1,7 @@
 body > footer.container
   padding-bottom: 0
+  font-size: .7rem
+
+
+  @media screen and (max-width: $size-small)
+    text-align: center

assets/styles/home.sass

@@ -16,17 +16,23 @@
   .cadre
     margin: 2rem 0
     display: inline-block
-    padding: 1rem
     line-height: 2
-    // background: no-repeat center url(/pictos/cadre.svg)
-    // background-size: container
-
-    border: 8px solid var(--color-highlight)
-
     a
-      padding: 1rem
+      display: inline-block
+      padding: 2rem
+      margin: 2rem
+      border: 8px solid var(--color-highlight)
 
 
+    @media screen and (max-width: $size-small)
+      border: 8px solid var(--color-highlight)
+
+      a
+        display: block
+        border: none
+        padding: .5rem 1rem
+        margin: 0
+
 #info
   display: flex
   justify-content: center
@@ -42,11 +48,12 @@
     text-align: center
     margin: 2rem 0
 
-  #valeurs
+#valeurs
-    background-color: var(--color-background-card)
+  .container
-
+    &:first-child
-    // transform: rotate(-2deg)
+      padding-bottom: 0
-    padding: 1rem
+    &:last-child
+      padding-top: 0
 
 #partenaire
   ul
@@ -66,3 +73,24 @@
 
     &:hover
       filter: grayscale(0)
+
+
+
+#me .container
+  align-items: center
+  @media screen and (max-width: $size-small)
+    flex-direction: column-reverse
+    justify-content: center
+
+  div
+    width: 450px
+    max-width: 100%
+
+  svg
+    width: 400px
+    height: 400px
+    @media screen and (max-width: $size-small)
+      width: calc(200px + #{$size-space*2})
+      height: calc(200px + #{$size-space*2})
+      margin: 0 auto
+      padding: $size-space

assets/styles/main.sass

@@ -131,25 +131,6 @@ h1
   &::after
     bottom: -1rem
 
-#me .container
-  align-items: center
-  @media screen and (max-width: $size-small)
-    flex-direction: column-reverse
-    justify-content: center
-
-  div
-    width: 450px
-    max-width: 100%
-
-    svg
-      width: 400px
-      height: 400px
-      @media screen and (max-width: $size-small)
-        width: calc(200px + #{$size-space*2})
-        height: calc(200px + #{$size-space*2})
-        margin: 0 auto
-        padding: $size-space
-
 @import "./home"
 @import "./basic/html"
 @import "./font"

content/_index.md

@@ -3,3 +3,13 @@ title: Weko, pour un numérique responsable de proximité
 ---
 
 ## Weko, une entreprise engagée
+
+Le numérique a envahi notre quotidien, la pandémie a montré l'importance de ce moyen de communication pour continuer à s'informer, s'organiser, se soigner. Mais il faut savoir que l’informatique représentait 4 % des émissions de gaz à effet de serre dans le monde en 2019, avec une hausse de 9% par an. C’est plus que le secteur aéronautique !
+
+Nous devons réagir pour minimiser son impact et pérenniser son utilisation sur plusieurs décennies. Nous avons la chance d'avoir des pionniers du GreenIT en France [qui informe sur cette problématique](https://greenit.fr) et propose de légiférer pour rendre obligatoire les démarches d'éco-conception. Si la France prend pas tout de suite des mesures l'Union européenne s'en chargera comme elle a fait avec la GDPR.
+
+Il faut savoir que les <sup>3</sup>/<sub>4</sub> des pollutions sont faits au moment de la création du matériel, luttons contre l'obsolescence programmer dû aux logiciels et réaliser des services en éco-conception pour permettre de limiter l'impact et de les rendre accessible à tous. [Des coopératives](https://fairtec.io/fr/) contribuent déjà en offrant des services alternatifs innovants.
+
+Prenons de l'avance, utilisons et créons ensemble les services numériques de demain !
+
+<!-- Heureusement des alternatives se mettent en place, elle existe et se sont regroupé derrière [FairTEC](https://fairtec.io/fr/) pour avoir une offre encore plus simple. Weko utilise ses services et peut vous conseiller sur leur utilisation. -->

data/homepage.yml

@@ -14,11 +14,11 @@ banner:
 
 valeur:
   enable: true
-  title: "Weko, une entreprise engagée"
+  title: "Les valeurs de Weko"
   valeur_item:
     - name : "Liberté"
       image : "valeur-liberte"
-      content : "Weko utilise uniquement des logiciels libres pour son infrastructure et ses services permettant une interropérabilité."
+      content : "Weko utilise uniquement des [logiciels libres](https://fr.wikipedia.org/wiki/Logiciel_libre) pour son infrastructure et ses services permettant une interopérabilité."
 
     - name : "Transparence"
       image : "valeur-transparence"
@@ -26,7 +26,7 @@ valeur:
 
     - name : "Sobriété"
       image : "valeur-sobriete"
-      content : "Les serveurs ont été achetés reconditionnés, ce sont des nano-ordinateurs (Raspberry Pi) consommant quelques watts."
+      content : "Les serveurs ont été achetés reconditionnés, ce sont des nano-ordinateurs ([Raspberry Pi](https://www.raspberrypi.org/products/raspberry-pi-4-model-b/)) consommant quelques watts."
 
     - name : "Éthique"
       image : "valeur-ethique"
@@ -34,11 +34,11 @@ valeur:
 
     - name : "Locale"
       image : "valeur-locale"
-      content : "Les serveurs sont auto-hébergés dans la <a href=\"https://www.loire.fr/\">Loire</a> dans la <a href=\"https://www.ccpu.fr/\">Communauté de Commune du Pays d'Urfé</a> à <a href=\"https://cremeaux.fr\">Crémeaux</a>, pour que vos données ne parcourent pas 15 000 km."
+      content : "Les serveurs sont auto-hébergés dans la <a href=\"https://www.loire.fr/\">Loire</a> dans la <a href=\"https://www.ccpu.fr/\">Communauté de Commune du Pays d'Urfé</a> à <a href=\"https://cremeaux.fr\">Crémeaux</a>, pour que vos données ne parcourent plus 15 000 km."
 
     - name : "Sécurité"
       image : "valeur-securite"
-      content : "La mise à jour des logiciels se fait de façon hebdomadaire. Des sauvegardes chiffrées sont effectués quotidiennement."
+      content : "La mise à jour des logiciels se fait de façon hebdomadaire. Des sauvegardes chiffrées sont effectuées quotidiennement."
 
 presentations:
   enable: true

layouts/home.html

@@ -5,7 +5,7 @@
   </section>
 
   <section id="presentation" class="section secondary">
-    <div class="container">
+    <div class="container cards">
     {{ $size := 100 }}
       <article class="card">
         <svg version="1.1" alt="Ordinateur" width="{{ $size }}" height="{{ $size }}" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 157 93" xml:space="preserve">
@@ -62,20 +62,22 @@
 
   <section id="contact" class="section container column center">
     <h2>Vous avez une idée, un projet ?<br>Contactez- moi !</h2>
-    <h3 class="cadre">
+    <h3 class="cadre"><a href="mailto:simon@weko.io">simon@weko.io</a><a href="tel:+33757180168">07 57 18 01 68</a></h3>
-      <a href="mailto:simon@weko.io">simon@weko.io</a>
+  </section>
-      <br>
+
-      <a href="tel:+33757180168">07 57 18 01 68</a>
+  <section class="section secondary">
-    </h3>
+    <article class="container">
+      {{ .Content }}
+    </article>
   </section>
 
   {{ if site.Data.homepage.valeur.enable }}
   {{ with site.Data.homepage.valeur }}
-  <section id="valeurs" class="section secondary">
+  <section id="valeurs" class="section">
     <div class="container center">
-      <h2>{{ .title | markdownify }}</h2>
+      <h3>{{ .title }}</h3>
     </div>
-    <div class="container">
+    <div class="container cards">
       {{ range .valeur_item }}
       <article class="card center">
         <!-- <img src="images/{{.image}}.svg" alt="{{ .name | title }}" height="64" width="64"> -->
@@ -103,13 +105,13 @@
           je cherche des solutions concrètes pour réduire mon impact.
         </p>
         <p>
-          Après 2 ans de recherches et tests, je lance <b>Weko</b>, dont l’objectif est d’<b>informer localement</b>
+          Après 2 ans de recherches et développement, je lance <b>Weko</b>, dont l’objectif est d’<b>informer localement</b>
           sur l’impact du numérique et <b>proposer des alternatives</b> que ça soit pour
           les entreprises, les associations mais aussi les collectivités ou les particuliers.
         </p>
         <p>N'hésitez pas à me <a href="#contact">contacter</a> !</p>
       </div>
-      <div>
+      <div class="center">
         <svg alt="Simon" height="200" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 400">
           <circle fill="#FFF" stroke="#000" stroke-width="2.978" stroke-miterlimit="10" cx="200" cy="200" r="198.5"/>
           <path fill="none" stroke="#000" stroke-width="3.383" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" d="M100.2 371c2.9-9.3 4.4-14 7.9-23.3l2.2-5.7 33.5 13.1-2 5.2M293.9 374.7c-1-9.6-1.2-12.9-2.7-22.6l-1.1-6-37 6.4.9 5.4c1.8 11.7 2.8 17.8 3.9 29.8"/>

layouts/partials/footer.html

@@ -1,4 +1,4 @@
 <footer class="section container">
-  <a href="https://www.websitecarbon.com/website/weko-io/">Émet seulement 0.05g de CO2</a>
+  <p>Ce site est optimisé, il <a href="https://www.websitecarbon.com/website/weko-io/">émet seulement 0.05g de CO<sub>2</sub></a> à chaque visite.</p>
   <p>©Weko 2021</p>
 </footer>