html && bootsrap section next_event

web/app/themes/la_mine/src/assets/scss/components/_header.scss

@@ -1,7 +0,0 @@
-header{
-    // position: fixed;
-    // top: 0;
-    // left:0;
-    // z-index: 999;
-    // width: 100%;
-}

web/app/themes/la_mine/src/assets/scss/components/_hero.scss

@@ -1,5 +1,6 @@
 .hero{
     height: 100vh;   
+    overflow: hidden; 
     figure{
         height: inherit;
         position: relative;
@@ -12,6 +13,7 @@
             img{
                 width: 100%;
                 height: 100%;
+                object-fit: cover;
             }
         }
         figcaption{

web/app/themes/la_mine/templates/accueil.twig

@@ -1,41 +1,31 @@
 {% extends "base.twig" %}
 
 {% block content %}
-<section class="section_accueil" id="section_proch">
+<section id="section_proch" class="row">
-	<div class="">
+	<div class="col">
-		<div class="header">
+		<h3>Prochainement</h3>	
-			<h3 class="titre">Prochainement</h3>
+		<div class="row">
-		</div>
-		<div class="__body">
-
-			<div class="coming_soon row justify-content-center">
 			{% for item in posts %}
 				{% include 'components/thumbnails/thumbnails.twig'%}
 			{% endfor %}
 		</div>
-
+		<div class="row">
-			<div class="btn tout_voir">
+			<a class="btn _all" rel="noreferrer" href="/agenda">Tout voir</a>
-				<a href="/agenda">Tout voir</a>
 		</div>
 	</div>
-
+	{# <div class="paralax" data-rellax-speed="5">
-		<div class="paralax" data-rellax-speed="5">
 		<img src="{{theme.link}}/asset/images/objet_1.svg" alt="objet 1">
-		</div>
+	</div> #}
-
-	</div>
 </section>
 
-<section class="section_accueil" id="section_asso">
+<section id="section_asso" class="row">
-	<div class="association">
 	{% include 'partial/section_asso.twig' %}
 	<div class="paralax" data-rellax-speed="3">
 		<img src="{{theme.link}}/asset/images/objet_2.svg" alt="objet 2">
 	</div>
-	</div>
 </section>
 
-<section class="section_accueil" id="section_projets">
+<section id="section_projets">
 	<div class="projet">
 		{% include 'partial/section_projets.twig' %}
 		<div class="paralax" data-rellax-speed="-2" data-rellax-percentage="0.5">
@@ -44,12 +34,12 @@
 	</div>
 </section>
 
-<section class="section_accueil" id="section_tpsF">
+<section id="section_tpsF">
 	<div class="temps_forts">
 	{% include 'partial/section_tpsF.twig' %}
 </section>
 
-<section class="section_accueil" id="section_MineVideo">
+<section id="section_MineVideo">
 	<div class="video">
 		<div class="__header">
 			<h3 class="titre">La Mine en vidéo</h3>

web/app/themes/la_mine/templates/base.twig

@@ -56,7 +56,7 @@
 			</figure>
 		{% endif %}
 
-		<main id="content" class="container-fluid" role="main">
+		<main id="content" class="containe-fluid" role="main">
 			{% if title %}
 				<h1>{{title}}</h1>
 			{% endif %}

web/app/themes/la_mine/templates/components/thumbnails/thumbnails.twig

@@ -4,52 +4,44 @@
   {% set cat = item.categories|first.slug %}
 {% endif %}
 
-<div class="item thumbnails col-12 col-sm-6 col-lg-4 mb-5 {{cat}}">
+<article class="thumbnails col {{cat}}">
-  <a href="{{site.url}}/{{item.post_name}}">
+  <a rel="noreferrer" href="{{site.url}}/{{item.post_name}}">
 
-    <div class="__images">
+    <figure>
-    <div class="icone_cat {{cat}}">
+      <span class="icone_cat {{cat}}"></span>
+      <img src="{{ Image(item.image_event).src }}">
+    </figure>
 
-    </div>
+    <div class="wrap_content">
-      <div class="__img">
+      <h5>{{item.title}}</h5>
-        <img src="{{ Image(item.image_event).src|resize(500, 500) }}" >
+      <div class="content">
-      </div>
+        <div class="date">
-    </div>
-
-    <div class="wrap__content_proch">
-      <div class="__title"><h5>{{item.title}}</h5></div>
-      <div class="__content">
-        <div class="__date">
-          <div class="__day">
           {% set start = item.informations_debut_event|date("Ydj") %}
           {% set end = item.informations_fin_event|date("Ydj") %}
-
           {% if start == end %}
             <span class="start">
-                Le <time>{{item.informations_debut_event|date("j F Y") }}</time>
+              Le <time datetime="{{item.informations_debut_event|date("j F Y")}}">{{item.informations_debut_event|date("j F Y") }}</time>
-                de <time>{{item.informations_debut_event|date("G:i")}}</time>
+              de <time datetime="{{item.informations_debut_event|date("G:i")}}">{{item.informations_debut_event|date("G:i")}}</time>
             </span>
             <span class="end">
-                à <time>{{item.informations_fin_event|date("G:i")}}</time>
+              à <time datetime="{{item.informations_fin_event|date("G:i")}}">{{item.informations_fin_event|date("G:i")}}</time>
             </span>
 
           {% else %}
 
             <span class="start">
-                Du <time>{{item.informations_debut_event|date("j F Y") }}</time>
+              Du <time datetime="{{item.informations_debut_event|date("j F Y") }}">{{item.informations_debut_event|date("j F Y") }}</time>
-                à <time>{{item.informations_debut_event|date("G:i")}}</time>
+              à <time datetime="{{item.informations_debut_event|date("G:i")}}">{{item.informations_debut_event|date("G:i")}}</time>
             </span>
             <span class="end">
-                <br>Au <time>{{item.informations_fin_event|date("j F Y") }}</time>
+              <br>Au <time datetime="{{item.informations_fin_event|date("j F Y") }}">{{item.informations_fin_event|date("j F Y") }}</time>
-                à <time>{{item.informations_fin_event|date("G:i")}}</time></br>
+              à <time datetime="{{item.informations_fin_event|date("G:i")}}">{{item.informations_fin_event|date("G:i")}}</time></br>
             </span>
 
           {% endif %}
         </div>
-        </div>
+        <div class="places">{{item.informations_lieu}}</div>
-
-        <div class="lieu">{{item.informations_lieu}}</div>
       </div>
     </div>
   </a>
-</div>
+</article>