content home

assets/css/style.css

@@ -1595,6 +1595,29 @@ body main {
   padding: 0 var(--padding-body);
 }
 
+.section--home {
+  margin: calc(var(--spacing) * 3);
+}
+.section--home .title-section {
+  font-size: var(--fs-medium);
+  font-weight: normal;
+  text-transform: uppercase;
+}
+
+#home__description .section--inner {
+  max-width: var(--max-w-container);
+}
+#home__description p {
+  font-size: var(--fs-big);
+  max-width: var(--max-w-content);
+}
+#home__description button {
+  margin-top: calc(var(--spacing) * 1);
+}
+#home__description button .icon svg {
+  width: 11px;
+}
+
 @media screen and (min-width: 560px) {
   [data-template=investigations] main #container-cards {
     max-width: var(--max-w-container);
@@ -1834,6 +1857,10 @@ body main {
     max-width: var(--max-w-content);
     margin: 0 auto;
   }
+  [data-template=investigation-summary] main header {
+    margin-left: auto;
+    margin-right: auto;
+  }
   [data-template=investigation-summary] main .section__article {
     max-width: var(--max-w-content);
     margin: calc(var(--spacing) * 3) auto;

assets/css/style.scss

@@ -32,6 +32,7 @@
 @import 'partials/main-layout';
 
 
+@import 'template/home';
 @import 'template/investigations';
 @import 'template/investigation-summary';
 @import 'template/rapport';

assets/css/template/_home.scss

@@ -0,0 +1,34 @@
+
+
+
+.section--home{
+    margin: calc(var(--spacing)*3);
+
+    .title-section{
+        font-size: var(--fs-medium);
+        font-weight: normal;
+        text-transform: uppercase;
+    }
+}
+#home__description{
+
+
+    .section--inner{
+        max-width: var(--max-w-container);
+    }
+
+    p{
+        font-size: var(--fs-big);
+        max-width: var(--max-w-content);
+    }
+
+    button{
+        margin-top: calc(var(--spacing)*1);
+    
+    }
+
+        button .icon svg{
+            width: 11px;
+        }
+    
+}

assets/css/template/_investigation-summary.scss

@@ -308,6 +308,12 @@
 
 
 
+        header{
+            margin-left: auto;
+            margin-right: auto;
+        }
+
+       
 
         .section__article{
             max-width: var(--max-w-content);

site/templates/home.php

@@ -1,10 +1,27 @@
 <?php snippet('header') ?>
 <main>
-  <p>
-    L’objet central de notre action est de concourir à la manifestation de la vérité dans des affaires où celle-ci est entravée par des intérêts de pouvoir.
-    Nos enquêtes portent principalement principalement sur les cas de violences policières, en France comme à l'international, ainsi que sur les violations des droits humains au sens large. Nous intervenons également dans les situations où nos techniques d'investigation numérique peuvent permettre d'établir les faits autour d'une controverse d'intérêt public, qu'elle soit historique ou contemporaine.
-    Notre champ d’action est avant tout public. Nos enquêtes et rapports d’expertise sont souvent publiés en partenariat avec d'autres médias d'information et sont régulièrement utilisés dans les procédures judiciaires sur les affaires concernées, contribuant ainsi à l'établissement des faits.
-    Nous œuvrons également à la diffusion des techniques et des méthodes de l’investigation en sources ouvertes (OSINT) au sein de la société civile. Dans le cadre de notre programme de formation, nous animons des ateliers avec des collectifs citoyens, des ONG, des universités et le grand public. Enfin, nous intervenons régulièrement dans la sphère publique pour présenter nos travaux et notre approche.
-  </p>
+
+<section class="section--home" id="home__description">
+  <div class="section--inner">
+  <p>Index est une ONG d’investigation numérique, au&nbsp;service du public, de la vérité et de la justice.</p>
+
+  <button class="btn--bold-inline btn--light">
+                <a href="#">
+                <span class="icon"><?= svg('assets/icons/arrow-left.svg') ?></span>
+                <span class="text">En savoir plus</span>
+                </a>
+            </button>
+
+  </div>
+</section>
+
+<section class="section--home" id="home__inverstigations">
+  <div class="section--inner">
+    <h2 class="title-section">Dernières Enquêtes</h2>
+  
+
+  </div>
+</section>
+
 </main>
 <?php snippet('footer') ?>