maj page actus

public/Pages/actu.html

@@ -1,11 +1,47 @@
 <div class="row">
     <div class="container-fluid">
-        <h2 class="section-heading">Actualité</h2>
+        <h2 class="section-heading">Actualités</h2>
         <hr class="light">              
         <div class="row"> 
-            <div class="col-md-12 text-center"">
-                <p><a href="http://bit.ly/2E5ZttV"><img class="img-responsive center-block" src="img/actus/souverainete_alimentaire.jpg" alt="Image Sommet pour la souveraineté alimentaire" /></a></p>
-                <p class="lead">Pour avoir des nouvelles fraîches, nous vous invitons à consulter <a href="https://mailchi.mp/tera/revue-de-campagne-3-cest-la-rentre" target="_blank">la dernière lettre d'information</a>.</p>
+            <div class="col-md-4">
+                <div class="panel panel-default">
+                    <div class="panel-heading">
+                        <h3 class="panel-title">Conseil scientifique</h3>        
+                    </div>
+                    <div class="panel-body">
+                        <p><img class="img-responsive center-block" src="img/actus/conseil_scientifique.jpg" alt="Photo conseil scientifique" /></p>
+                        <ul>
+                            <li><a href="https://agora.tera.coop/cloud/index.php/s/XSPs9zFk4kyLsee">Consulter le document préparatoire</a></li>
+                            <li><a href="https://agora.tera.coop/cloud/index.php/s/rZR8kB5dJmK8Qae">Consulter le compte-rendu</a></li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+            <div class="col-md-4">
+                <div class="panel panel-default">
+                    <div class="panel-heading">
+                        <h3 class="panel-title">Lettre d'information</h3>        
+                    </div>
+                    <div class="panel-body">
+                        <p><img class="img-responsive center-block" src="img/actus/lettre_info.jpg" alt="Photo lettre d'information" /></p>
+                        <ul>
+                            <li><a href="https://mailchi.mp/tera/le-temps-des-assembles-2500505?.">Venez lire la dernière lettre d'information</a></li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+            <div class="col-md-4">
+                <div class="panel panel-default">
+                    <div class="panel-heading">
+                        <h3 class="panel-title">Campagne de financement</h3>        
+                    </div>
+                    <div class="panel-body">
+                        <p><img class="img-responsive center-block" src="img/actus/lustrac.png" alt="Photo quartier rural de Lustrac" /></p>
+                        <ul>
+                            <li>Nous avons besoin de votre soutien pour que le quartier rural prenne forme !</li>
+                        </ul>
+                    </div>
+                </div>
             </div>
         </div>
     </div>

public/css/creative.css

@@ -53,8 +53,11 @@
 #soutenez-nous ol li {
     margin-bottom: 20px;
 }
+#actu .panel-title {
+    text-align: center;
+}
 #actu a {
-    color: #fff;
+    color: #000;
     text-decoration: underline;
 }
 #actu a:hover, #actu a:focus {
@@ -75,7 +78,7 @@
 	margin-right: 10px;
 }
 
-#projet .panel {
+#projet .panel, #actu .panel {
         color: #333;
         margin-bottom: 75px;
 }
@@ -90,7 +93,7 @@
         margin-bottom: 30px;
         font-weight: bold;
 }
-#projet .panel-title {
+#projet .panel-title, #actu .panel-title {
         font-size: 20px;
         font-weight: 600;
 }

public/index.html

@@ -74,7 +74,7 @@
                         <a class="page-scroll highlight" href="#soutenez-nous">Soutenez-nous !</a>
                     </li>-->
                     <li>
-                        <a class="page-scroll" href="#actu">Actualité</a>
+                        <a class="page-scroll" href="#actu">Actualités</a>
                     </li>
                     <li>
                         <a class="page-scroll" href="#vision">Vision</a>