correction && add form && add slide && add masonry && css

web/app/themes/la_mine/asset/dist/css/flickity.css

@@ -0,0 +1,137 @@
+/*! Flickity v2.2.1
+https://flickity.metafizzy.co
+---------------------------------------------- */
+
+.flickity-enabled {
+  position: relative;
+}
+
+.flickity-enabled:focus { outline: none; }
+
+.flickity-viewport {
+  overflow: hidden;
+  position: relative;
+  height: 100%;
+}
+
+.flickity-slider {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+}
+
+/* draggable */
+
+.flickity-enabled.is-draggable {
+  -webkit-tap-highlight-color: transparent;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+}
+
+.flickity-enabled.is-draggable .flickity-viewport {
+  cursor: move;
+  cursor: -webkit-grab;
+  cursor: grab;
+}
+
+.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
+  cursor: -webkit-grabbing;
+  cursor: grabbing;
+}
+
+/* ---- flickity-button ---- */
+
+.flickity-button {
+  position: absolute;
+  background: hsla(0, 0%, 100%, 0.75);
+  border: none;
+  color: #333;
+}
+
+.flickity-button:hover {
+  background: white;
+  cursor: pointer;
+}
+
+.flickity-button:focus {
+  outline: none;
+  box-shadow: 0 0 0 5px #19F;
+}
+
+.flickity-button:active {
+  opacity: 0.6;
+}
+
+.flickity-button:disabled {
+  opacity: 0.3;
+  cursor: auto;
+  /* prevent disabled button from capturing pointer up event. #716 */
+  pointer-events: none;
+}
+
+.flickity-button-icon {
+  fill: currentColor;
+}
+
+/* ---- previous/next buttons ---- */
+
+.flickity-prev-next-button {
+  top: 50%;
+  width: 44px;
+  height: 44px;
+  border-radius: 50%;
+  /* vertically center */
+  transform: translateY(-50%);
+}
+
+.flickity-prev-next-button.previous { left: 10px; }
+.flickity-prev-next-button.next { right: 10px; }
+/* right to left */
+.flickity-rtl .flickity-prev-next-button.previous {
+  left: auto;
+  right: 10px;
+}
+.flickity-rtl .flickity-prev-next-button.next {
+  right: auto;
+  left: 10px;
+}
+
+.flickity-prev-next-button .flickity-button-icon {
+  position: absolute;
+  left: 20%;
+  top: 20%;
+  width: 60%;
+  height: 60%;
+}
+
+/* ---- page dots ---- */
+
+.flickity-page-dots {
+  position: absolute;
+  width: 100%;
+  bottom: -25px;
+  padding: 0;
+  margin: 0;
+  list-style: none;
+  text-align: center;
+  line-height: 1;
+}
+
+.flickity-rtl .flickity-page-dots { direction: rtl; }
+
+.flickity-page-dots .dot {
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  margin: 0 8px;
+  background: #333;
+  border-radius: 50%;
+  opacity: 0.25;
+  cursor: pointer;
+}
+
+.flickity-page-dots .dot.is-selected {
+  opacity: 1;
+}

web/app/themes/la_mine/asset/dist/index.js

@@ -0,0 +1,30 @@
+var Home = document.querySelector('.hero .slide');
+var flkty = new Flickity( Home, {
+  // options
+  cellAlign: 'left',
+  autoPlay: true,
+  prevNextButtons: false
+});
+
+var prive = document.querySelector('.prive .__slide');
+var flkty = new Flickity( prive, {
+  // options
+  cellAlign: 'left',
+  autoPlay: true,
+})
+
+var slide_tpsF = document.querySelectorAll('.tpsF .slide');
+for (var i = 0; i < slide_tpsF.length; i++) {
+  var flkty = new Flickity( slide_tpsF[i], {
+    // options
+    cellAlign: 'left',
+    autoPlay: true,
+    pageDots: false
+  });
+}
+
+var msnry = new Masonry( '.tableau_engagements.row', {
+  columnWidth: '.engagement',
+  itemSelector: '.engagement',
+  percentPosition: true
+});

web/app/themes/la_mine/asset/dist/style.css

@@ -0,0 +1,112 @@
+img{
+  width: 100%;
+  height: auto;
+}
+
+footer img{
+  width: 50px;
+  height: auto;
+}
+footer li {
+  list-style-type:none;
+}
+
+.sidebar_left {
+  background-color: pink;
+}
+.tableau_engagements {
+  background-color: green;
+}
+.tableau_engagements div{
+    background-color: red;
+}
+
+/* .tableau_engagements >  div{
+    display: inline-block;
+} */
+.legendes{
+  background-color: pink;
+  position : absolute;
+  bottom: 100px;
+}
+
+
+/* START KEVIN */
+  header{
+    z-index: 9999;
+    position: absolute;
+    width: 100%;
+    top: 0;
+    left: 0;
+  }
+  .hero{
+    width: 100%;
+    height: 100vh;
+    position: relative;
+  }
+  .hero .slide{
+    width: 100%;
+    height: 100vh;
+    overflow: hidden;
+  }
+  .hero .slide .image{
+    width: 100%;
+    height: 100vh;
+  }
+  .hero .slide img{
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+  .hero .slide .flickity-page-dots{
+    bottom: 20px;
+  }
+  .hero .slide .flickity-page-dots li{
+    background: white;
+  }
+  .hero .__head{
+    width: 100%;
+    text-align: center;
+    position: absolute;
+    bottom: 60px;
+    color: white;
+  }
+
+  .wrapper  section{
+    margin: 150px 0;
+  }
+
+  .tpsF .img{
+    width: 100%;
+    height: 400px;
+  }
+  .tpsF .img img{
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+  .projet .img{
+    height: 300px;
+  }
+  .projet .img img{
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+
+  .tableau_engagements .engagement{
+    width: 50%;
+  }
+
+  .prive .images{
+    width: 100%;
+    height: 600px;
+  }
+  .prive .img img{
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+
+
+/* END KEVIN */